diff --git a/semantic.json b/semantic.json index 6ffc0ae9..cef7792a 100644 --- a/semantic.json +++ b/semantic.json @@ -27,31 +27,32 @@ "grid", "button", + "calendar", "card", - "divider", "dimmer", + "divider", "dropdown", + "form", "header", "icon", "image", "input", "label", - "loader", "list", + "list", + "loader", + "menu", + "message", "modal", + "popup", "progress", "segment", "sidebar", "statistic", + "step", + "tab", "text", "toast", - "form", - "menu", - "calendar", - "popup", - "message", - "list", - "tab", "api", "transition" diff --git a/semantic/dist/components/step.css b/semantic/dist/components/step.css new file mode 100644 index 00000000..baf9d6f6 --- /dev/null +++ b/semantic/dist/components/step.css @@ -0,0 +1,700 @@ +/*! + * # Fomantic-UI 2.8.8 - Step + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + + +/******************************* + Plural +*******************************/ + +.ui.steps { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; + margin: 1em 0; + background: ''; + -webkit-box-shadow: none; + box-shadow: none; + line-height: 1.16666667em; + border-radius: 0.33333333rem; + border: 1px solid rgba(34, 36, 38, 0.15); +} +.ui.steps:not(.unstackable) { + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +/* First Steps */ +.ui.steps:first-child { + margin-top: 0; +} + +/* Last Steps */ +.ui.steps:last-child { + margin-bottom: 0; +} + + +/******************************* + Singular +*******************************/ + +.ui.steps .step { + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-flex: 1; + -ms-flex: 1 0 auto; + flex: 1 0 auto; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + vertical-align: middle; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + margin: 0 0; + padding: 1.16666667em 2em; + background: #FFFFFF; + color: rgba(0, 0, 0, 0.87); + -webkit-box-shadow: none; + box-shadow: none; + border-radius: 0; + border: none; + border-right: 1px solid rgba(34, 36, 38, 0.15); + -webkit-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease; +} + +/* Arrow */ +.ui.steps .step:after { + display: none; + position: absolute; + z-index: 2; + content: ''; + top: 50%; + right: 0; + background-color: #FFFFFF; + width: 1.16666667em; + height: 1.16666667em; + border-style: solid; + border-color: rgba(34, 36, 38, 0.15); + border-width: 0 1px 1px 0; + -webkit-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease; + -webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg); + transform: translateY(-50%) translateX(50%) rotate(-45deg); +} + +/* First Step */ +.ui.steps .step:first-child { + padding-left: 2em; + border-radius: 0.33333333rem 0 0 0.33333333rem; +} + +/* Last Step */ +.ui.steps .step:last-child { + border-radius: 0 0.33333333rem 0.33333333rem 0; + border-right: none; + margin-right: 0; +} + +/* Only Step */ +.ui.steps .step:only-child { + border-radius: 0.33333333rem; +} + + +/******************************* + Content +*******************************/ + + +/* Title */ +.ui.steps .step .title { + font-family: 'Raleway', sans-serif; + font-size: 1.16666667em; + font-weight: bold; +} +.ui.steps .step > .title { + width: 100%; +} + +/* Description */ +.ui.steps .step .description { + font-weight: normal; + font-size: 0.91666667em; + color: rgba(0, 0, 0, 0.87); +} +.ui.steps .step > .description { + width: 100%; +} +.ui.steps .step .title ~ .description { + margin-top: 0.25em; +} + +/* Icon */ +.ui.steps .step > i.icon { + line-height: 1; + font-size: 2.5em; + margin: 0 1rem 0 0; +} +.ui.steps .step > i.icon, +.ui.steps .step > i.icon ~ .content { + display: block; + -webkit-box-flex: 0; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -ms-flex-item-align: middle; + align-self: middle; +} + +/* Horizontal Icon */ +.ui.steps:not(.vertical) .step > i.icon { + width: auto; +} + +/* Link */ +.ui.steps .link.step, +.ui.steps a.step { + cursor: pointer; +} + + +/******************************* + Types +*******************************/ + + +/*-------------- + Ordered + ---------------*/ + +.ui.ordered.steps { + counter-reset: ordered; +} +.ui.ordered.steps .step:before { + display: block; + position: static; + text-align: center; + content: counter(ordered); + -ms-flex-item-align: middle; + align-self: middle; + margin-right: 1rem; + font-size: 2.5em; + counter-increment: ordered; + font-family: inherit; + font-weight: bold; +} +.ui.ordered.steps .step > * { + display: block; + -ms-flex-item-align: middle; + align-self: middle; +} + +/*-------------- + Vertical + ---------------*/ + +.ui.vertical.steps { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + overflow: visible; +} +.ui.vertical.steps .step { + -webkit-box-pack: start; + -ms-flex-pack: start; + justify-content: flex-start; + border-radius: 0; + padding: 1.16666667em 2em; + border-right: none; + border-bottom: 1px solid rgba(34, 36, 38, 0.15); +} +.ui.vertical.steps .step:first-child { + padding: 1.16666667em 2em; + border-radius: 0.33333333rem 0.33333333rem 0 0; +} +.ui.vertical.steps .step:last-child { + border-bottom: none; + border-radius: 0 0 0.33333333rem 0.33333333rem; +} +.ui.vertical.steps .step:only-child { + border-radius: 0.33333333rem; +} + +/* Arrow */ +.ui.vertical.steps .step:after { + top: 50%; + right: 0; + border-width: 0 1px 1px 0; + display: none; +} +.ui.right.vertical.steps .step:after { + border-width: 1px 0 0 1px; + left: 0; + right: 100%; + -webkit-transform: translateY(-50%) translateX(-50%) rotate(-45deg); + transform: translateY(-50%) translateX(-50%) rotate(-45deg); +} +.ui.vertical.steps .active.step:after { + display: block; +} +.ui.vertical.steps .step:last-child:after { + display: none; +} +.ui.vertical.steps .active.step:last-child:after { + display: block; +} + +/*--------------- + Responsive +----------------*/ + + +/* Mobile (Default) */ +@media only screen and (max-width: 767.98px) { + .ui.steps:not(.unstackable) { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + overflow: visible; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } + .ui.steps:not(.unstackable) .step { + width: 100% !important; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + border-radius: 0; + padding: 1.16666667em 2em; + border-right: none; + border-bottom: 1px solid rgba(34, 36, 38, 0.15); + } + .ui.steps:not(.unstackable) .step:first-child { + padding: 1.16666667em 2em; + border-radius: 0.33333333rem 0.33333333rem 0 0; + } + .ui.steps:not(.unstackable) .step:last-child { + border-radius: 0 0 0.33333333rem 0.33333333rem; + border-bottom: none; + } + +/* Arrow */ + .ui.steps:not(.unstackable) .step:after { + top: unset; + bottom: -1.16666667em; + right: 50%; + -webkit-transform: translateY(-50%) translateX(50%) rotate(45deg); + transform: translateY(-50%) translateX(50%) rotate(45deg); + } + .ui.vertical.steps .active.step:last-child:after { + display: none; + } + +/* Content */ + .ui.steps:not(.unstackable) .step .content { + text-align: center; + } + +/* Icon */ + .ui.steps:not(.unstackable) .step > i.icon, + .ui.ordered.steps:not(.unstackable) .step:before { + margin: 0 0 1rem 0; + } +} + + +/******************************* + States +*******************************/ + + +/* Link Hover */ +.ui.steps .link.step:hover::after, +.ui.steps .link.step:hover, +.ui.steps a.step:hover::after, +.ui.steps a.step:hover { + background: #F9FAFB; + color: rgba(0, 0, 0, 0.8); +} + +/* Link Down */ +.ui.steps .link.step:active::after, +.ui.steps .link.step:active, +.ui.steps a.step:active::after, +.ui.steps a.step:active { + background: #F3F4F5; + color: rgba(0, 0, 0, 0.9); +} + +/* Active */ +.ui.steps .step.active { + cursor: auto; + background: #F3F4F5; +} +.ui.steps .step.active:after { + background: #F3F4F5; +} +.ui.steps .step.active .title { + color: #6435C9; +} +.ui.ordered.steps .step.active:before, +.ui.steps .active.step i.icon { + color: rgba(0, 0, 0, 0.85); +} + +/* Active Arrow */ +.ui.steps .step:after { + display: block; +} +.ui.steps .active.step:after { + display: block; +} +.ui.steps .step:last-child:after { + display: none; +} +.ui.steps .active.step:last-child:after { + display: none; +} + +/* Active Hover */ +.ui.steps .link.active.step:hover::after, +.ui.steps .link.active.step:hover, +.ui.steps a.active.step:hover::after, +.ui.steps a.active.step:hover { + cursor: pointer; + background: #DCDDDE; + color: rgba(0, 0, 0, 0.87); +} + +/* Completed */ +.ui.steps .step.completed > i.icon:before, +.ui.ordered.steps .step.completed:before { + color: #21BA45; +} + +/* Disabled */ +.ui.steps .disabled.step { + cursor: auto; + background: #FFFFFF; + pointer-events: none; +} +.ui.steps .disabled.step, +.ui.steps .disabled.step .title, +.ui.steps .disabled.step .description { + color: rgba(40, 40, 40, 0.3); +} +.ui.steps .disabled.step:after { + background: #FFFFFF; +} + + +/******************************* + Variations +*******************************/ + + +/*-------------- + Stackable + ---------------*/ + + +/* Tablet Or Below */ +@media only screen and (max-width: 991.98px) { + .ui[class*="tablet stackable"].steps { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + overflow: visible; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } + +/* Steps */ + .ui[class*="tablet stackable"].steps .step { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + border-radius: 0; + padding: 1.16666667em 2em; + border-right: none; + border-bottom: 1px solid rgba(34, 36, 38, 0.15); + } + .ui[class*="tablet stackable"].steps .step:first-child { + padding: 1.16666667em 2em; + border-radius: 0.33333333rem 0.33333333rem 0 0; + } + .ui[class*="tablet stackable"].steps .step:last-child { + border-radius: 0 0 0.33333333rem 0.33333333rem; + border-bottom: none; + } + +/* Arrow */ + .ui[class*="tablet stackable"].steps .step:after { + top: unset; + bottom: -1.16666667em; + right: 50%; + -webkit-transform: translateY(-50%) translateX(50%) rotate(45deg); + transform: translateY(-50%) translateX(50%) rotate(45deg); + } + +/* Content */ + .ui[class*="tablet stackable"].steps .step .content { + text-align: center; + } + +/* Icon */ + .ui[class*="tablet stackable"].steps .step > i.icon, + .ui[class*="tablet stackable"].ordered.steps .step:before { + margin: 0 0 1rem 0; + } +} + +/*-------------- + Fluid + ---------------*/ + + +/* Fluid */ +.ui.fluid.steps { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +/*-------------- + Attached + ---------------*/ + + +/* Top */ +.ui.attached.steps { + width: calc(100% + 2px) !important; + margin: 0 -1px 0; + max-width: calc(100% + 2px); + border-radius: 0.33333333rem 0.33333333rem 0 0; +} +.ui.attached.steps .step:first-child { + border-radius: 0.33333333rem 0 0 0; +} +.ui.attached.steps .step:last-child { + border-radius: 0 0.33333333rem 0 0; +} + +/* Bottom */ +.ui.bottom.attached.steps { + margin: 0 -1px 0; + border-radius: 0 0 0.33333333rem 0.33333333rem; +} +.ui.bottom.attached.steps .step:first-child { + border-radius: 0 0 0 0.33333333rem; +} +.ui.bottom.attached.steps .step:last-child { + border-radius: 0 0 0.33333333rem 0; +} + +/*------------------- + Evenly Divided +--------------------*/ + +.ui.one.steps, +.ui.two.steps, +.ui.three.steps, +.ui.four.steps, +.ui.five.steps, +.ui.six.steps, +.ui.seven.steps, +.ui.eight.steps { + width: 100%; +} +.ui.one.steps > .step, +.ui.two.steps > .step, +.ui.three.steps > .step, +.ui.four.steps > .step, +.ui.five.steps > .step, +.ui.six.steps > .step, +.ui.seven.steps > .step, +.ui.eight.steps > .step { + -ms-flex-wrap: nowrap; + flex-wrap: nowrap; +} +.ui.one.steps > .step { + width: 100%; +} +.ui.two.steps > .step { + width: 50%; +} +.ui.three.steps > .step { + width: 33.333%; +} +.ui.four.steps > .step { + width: 25%; +} +.ui.five.steps > .step { + width: 20%; +} +.ui.six.steps > .step { + width: 16.666%; +} +.ui.seven.steps > .step { + width: 14.285%; +} +.ui.eight.steps > .step { + width: 12.5%; +} + +/*------------------- + Sizes +--------------------*/ + +.ui.steps .step, +.ui.step { + font-size: 1rem; +} +.ui.mini.steps .step, +.ui.mini.step { + font-size: 0.75rem; +} +.ui.tiny.steps .step, +.ui.tiny.step { + font-size: 0.83333333rem; +} +.ui.small.steps .step, +.ui.small.step { + font-size: 0.91666667rem; +} +.ui.large.steps .step, +.ui.large.step { + font-size: 1.16666667rem; +} +.ui.big.steps .step, +.ui.big.step { + font-size: 1.25rem; +} +.ui.huge.steps .step, +.ui.huge.step { + font-size: 1.41666667rem; +} +.ui.massive.steps .step, +.ui.massive.step { + font-size: 1.75rem; +} + +/*-------------- + Inverted + ---------------*/ + +.ui.inverted.steps { + border: 1px solid #555555; +} +.ui.inverted.steps .step { + color: rgba(255, 255, 255, 0.9); + background: #1B1C1D; + border-color: #555555; +} +.ui.inverted.steps .step:after { + background-color: #1B1C1D; + border-color: #555555; +} +.ui.inverted.steps .step .description { + color: rgba(255, 255, 255, 0.9); +} + +/* Active */ +.ui.inverted.steps .step.active, +.ui.inverted.steps .step.active:after { + background: #333333; +} +.ui.inverted.ordered.steps .step.active:before, +.ui.inverted.steps .active.step i.icon { + color: #ffffff; +} + +/* Disabled */ +.ui.inverted.steps .disabled.step, +.ui.inverted.steps .disabled.step:after { + background: #222222; +} +.ui.inverted.steps .disabled.step, +.ui.inverted.steps .disabled.step .title, +.ui.inverted.steps .disabled.step .description { + color: rgba(225, 225, 225, 0.3); +} + +/* Link Hover */ +.ui.inverted.steps .link.step:hover::after, +.ui.inverted.steps .link.step:hover, +.ui.inverted.steps a.step:hover::after, +.ui.inverted.steps a.step:hover { + background: #3F3F3F; + color: #ffffff; +} + +/* Link Down */ +.ui.inverted.steps .link.step:active::after, +.ui.inverted.steps .link.step:active, +.ui.inverted.steps a.step:active::after, +.ui.inverted.steps a.step:active { + background: #444444; + color: #ffffff; +} + + +/******************************* + Theme Overrides +*******************************/ + +@font-face { + font-family: 'Step'; + src: url(data:application/x-font-ttf;charset=utf-8;;base64,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) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAoUAA4AAAAAEPQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEQAAABWPeFJAWNtYXAAAAGIAAAAOgAAAUrQEhm3Y3Z0IAAAAcQAAAAUAAAAHAZJ/5RmcGdtAAAB2AAABPkAAAmRigp4O2dhc3AAAAbUAAAACAAAAAgAAAAQZ2x5ZgAABtwAAACuAAAAtt9nBHZoZWFkAAAHjAAAADUAAAA2ASs8e2hoZWEAAAfEAAAAIAAAACQHUwNNaG10eAAAB+QAAAAMAAAADAspAABsb2NhAAAH8AAAAAgAAAAIADgAW21heHAAAAf4AAAAIAAAACAApgm8bmFtZQAACBgAAAF3AAACzcydGhxwb3N0AAAJkAAAACoAAAA7rr1AmHByZXAAAAm8AAAAVgAAAFaSoZr/eJxjYGTewTiBgZWBg6mKaQ8DA0MPhGZ8wGDIyMTAwMTAysyAFQSkuaYwOLxgeMHIHPQ/iyGKmZvBHyjMCJIDAPe9C2B4nGNgYGBmgGAZBkYGEHAB8hjBfBYGDSDNBqQZGZgYGF4w/v8PUvCCAURLMELVAwEjG8OIBwBk5AavAAB4nGNgQANGDEbM3P83gjAAELQD4XicnVXZdtNWFJU8ZHASOmSgoA7X3DhQ68qEKRgwaSrFdiEdHAitBB2kDHTkncc+62uOQrtWH/m07n09JLR0rbYsls++R1tn2DrnRhwjKn0aiGvUoZKXA6msPZZK90lc13Uvj5UMBnFdthJPSZuonSRKat3sUC7xWOsqWSdYJ+PlIFZPVZ5noAziFB5lSUQbRBuplyZJ4onjJ4kWZxAfJUkgJaMQp9LIUEI1GsRS1aFM6dCr1xNx00DKRqMedVhU90PFJ8c1p9SsA0YqVznCFevVRr4bpwMve5DEOsGzrYcxHnisfpQqkIqR6cg/dkpOlIaBVHHUoVbi6DCTX/eRTCrNQKaMYkWl7oG43f102xYxPXQ6vi5KlUaqurnOKJrt0fGogygP2cbppNzQ2fbw5RlTVKtdcbPtQGYNXErJbHSfRAAdJlLj6QFONZwCqRn1R8XZ588BEslclKo8VTKHegOZMzt7cTHtbiersnCknwcyb3Z2452HQ6dXh3/R+hdM4cxHj+Jifj5C+lBqfiJOJKVGWMzyp4YfcVcgQrkxiAsXyuBThDl0RdrZZl3jtTH2hs/5SqlhPQna6KP4fgr9TiQrHGdRo/VInM1j13Wt3GdQS7W7Fzsyr0OVIu7vCwuuM+eEYZ4WC1VfnvneBTT/Bohn/EDeNIVL+5YpSrRvm6JMu2iKCu0SVKVdNsUU7YoppmnPmmKG9h1TzNKeMzLj/8vc55H7HN7xkJv2XeSmfQ+5ad9HbtoPkJtWITdtHblpLyA3rUZu2lWjOnYEGgZpF1IVQdA0svph3Fab9UDWjDR8aWDyLmLI+upER521tcofxX914gsHcmmip7siF5viLq/bFj483e6rj5pG3bDV+MaR8jAeRnocmtBZ+c3hv+1N3S6a7jKqMugBFUwKwABl7UAC0zrbCaT1mqf48gdgXIZ4zkpDtVSfO4am7+V5X/exOfG+x+3GLrdcd3kJWdYNcmP28N9SZKrrH+UtrVQnR6wrJ49VaxhDKrwour6SlHu0tRu/KKmy8l6U1srnk5CbPYMbQlu27mGwI0xpyiUeXlOlKD3UUo6yQyxvKco84JSLC1qGxLgOdQ9qa8TpoXoYGwshhqG0vRBwSCldFd+0ynfxHqtr2Oj4xRXh6XpyEhGf4ir7UfBU10b96A7avGbdMoMpVaqn+4xPsa/b9lFZaaSOsxe3VAfXNOsaORXTT+Rr4HRvOGjdAz1UfDRBI1U1x+jGKGM0ljXl3wR0MVZ+w2jVYvs93E+dpFWsuUuY7JsT9+C0u/0q+7WcW0bW/dcGvW3kip8jMb8tCvw7B2K3ZA3UO5OBGAvIWdAYxhYmdxiug23EbfY/Jqf/34aFRXJXOxq7eerD1ZNRJXfZ8rjLTXZZ16M2R9VOGvsIjS0PN+bY4XIstsRgQbb+wf8x7gF3aVEC4NDIZZiI2nShnurh6h6rsW04VxIBds2x43QAegAuQd8cu9bzCYD13CPnLsB9cgh2yCH4lByCz8i5BfA5OQRfkEMwIIdgl5w7AA/IIXhIDsEeOQSPyNkE+JIcgq/IIYjJIUjIuQ3wmByCJ+QQfE0OwTdGrk5k/pYH2QD6zqKbQKmdGhzaOGRGrk3Y+zxY9oFFZB9aROqRkesT6lMeLPV7i0j9wSJSfzRyY0L9iQdL/dkiUn+xiNRnxpeZIymvDp7zjg7+BJfqrV4AAAAAAQAB//8AD3icY2BkAALmJUwzGEQZZBwk+RkZGBmdGJgYmbIYgMwsoGSiiLgIs5A2owg7I5uSOqOaiT2jmZE8I5gQY17C/09BQEfg3yt+fh8gvYQxD0j68DOJiQn8U+DnZxQDcQUEljLmCwBpBgbG/3//b2SOZ+Zm4GEQcuAH2sblDLSEm8FFVJhJEGgLH6OSHpMdo5EcI3Nk0bEXJ/LYqvZ82VXHGFd6pKTkyCsQwQAAq+QkqAAAeJxjYGRgYADiw5VSsfH8Nl8ZuJlfAEUYzpvO6IXQCb7///7fyLyEmRvI5WBgAokCAFb/DJAAAAB4nGNgZGBgDvqfxRDF/IKB4f935iUMQBEUwAwAi5YFpgPoAAAD6AAAA1kAAAAAAAAAOABbAAEAAAADABYAAQAAAAAAAgAGABMAbgAAAC0JkQAAAAB4nHWQy2rCQBSG//HSi0JbWui2sypKabxgN4IgWHTTbqS4LTHGJBIzMhkFX6Pv0IfpS/RZ+puMpShNmMx3vjlz5mQAXOMbAvnzxJGzwBmjnAs4Rc9ykf7Zcon8YrmMKt4sn9C/W67gAYHlKm7wwQqidM5ogU/LAlfi0nIBF+LOcpH+0XKJ3LNcxq14tXxC71muYCJSy1Xci6+BWm11FIRG1gZ12W62OnK6lYoqStxYumsTKp3KvpyrxPhxrBxPLfc89oN17Op9uJ8nvk4jlciW09yrkZ/42jX+bFc93QRtY+ZyrtVSDm2GXGm18D3jhMasuo3G3/MwgMIKW2hEvKoQBhI12jrnNppooUOaMkMyM8+KkMBFTONizR1htpIy7nPMGSW0PjNisgOP3+WRH5MC7o9ZRR+tHsYT0u6MKPOSfTns7jBrREqyTDezs9/eU2x4WpvWcNeuS511JTE8qCF5H7u1BY1H72S3Ymi7aPD95/9+AN1fhEsAeJxjYGKAAC4G7ICZgYGRiZGZMzkjNTk7N7Eomy05syg5J5WBAQBE1QZBAABLuADIUlixAQGOWbkIAAgAYyCwASNEsAMjcLIEKAlFUkSyCgIHKrEGAUSxJAGIUViwQIhYsQYDRLEmAYhRWLgEAIhYsQYBRFlZWVm4Af+FsASNsQUARAAA) format('woff'); +} +.ui.steps .step.completed > .icon:before, +.ui.ordered.steps .step.completed:before { + font-family: 'Step'; + content: '\e800'; + +/* '' */ +} + + +/******************************* + Site Overrides +*******************************/ + diff --git a/semantic/dist/components/step.min.css b/semantic/dist/components/step.min.css new file mode 100644 index 00000000..18558eca --- /dev/null +++ b/semantic/dist/components/step.min.css @@ -0,0 +1,9 @@ +/*! + * # Fomantic-UI 2.8.8 - Step + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */.ui.steps{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;margin:1em 0;background:'';-webkit-box-shadow:none;box-shadow:none;line-height:1.16666667em;border-radius:.33333333rem;border:1px solid rgba(34,36,38,.15)}.ui.steps:not(.unstackable){-ms-flex-wrap:wrap;flex-wrap:wrap}.ui.steps:first-child{margin-top:0}.ui.steps:last-child{margin-bottom:0}.ui.steps .step{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;vertical-align:middle;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin:0 0;padding:1.16666667em 2em;background:#fff;color:rgba(0,0,0,.87);-webkit-box-shadow:none;box-shadow:none;border-radius:0;border:none;border-right:1px solid rgba(34,36,38,.15);-webkit-transition:background-color .1s ease,opacity .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background-color .1s ease,opacity .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background-color .1s ease,opacity .1s ease,color .1s ease,box-shadow .1s ease;transition:background-color .1s ease,opacity .1s ease,color .1s ease,box-shadow .1s ease,-webkit-box-shadow .1s ease}.ui.steps .step:after{display:none;position:absolute;z-index:2;content:'';top:50%;right:0;background-color:#fff;width:1.16666667em;height:1.16666667em;border-style:solid;border-color:rgba(34,36,38,.15);border-width:0 1px 1px 0;-webkit-transition:background-color .1s ease,opacity .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background-color .1s ease,opacity .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background-color .1s ease,opacity .1s ease,color .1s ease,box-shadow .1s ease;transition:background-color .1s ease,opacity .1s ease,color .1s ease,box-shadow .1s ease,-webkit-box-shadow .1s ease;-webkit-transform:translateY(-50%) translateX(50%) rotate(-45deg);transform:translateY(-50%) translateX(50%) rotate(-45deg)}.ui.steps .step:first-child{padding-left:2em;border-radius:.33333333rem 0 0 .33333333rem}.ui.steps .step:last-child{border-radius:0 .33333333rem .33333333rem 0;border-right:none;margin-right:0}.ui.steps .step:only-child{border-radius:.33333333rem}.ui.steps .step .title{font-family:Raleway,sans-serif;font-size:1.16666667em;font-weight:700}.ui.steps .step>.title{width:100%}.ui.steps .step .description{font-weight:400;font-size:.91666667em;color:rgba(0,0,0,.87)}.ui.steps .step>.description{width:100%}.ui.steps .step .title~.description{margin-top:.25em}.ui.steps .step>i.icon{line-height:1;font-size:2.5em;margin:0 1rem 0 0}.ui.steps .step>i.icon,.ui.steps .step>i.icon~.content{display:block;-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;-ms-flex-item-align:middle;align-self:middle}.ui.steps:not(.vertical) .step>i.icon{width:auto}.ui.steps .link.step,.ui.steps a.step{cursor:pointer}.ui.ordered.steps{counter-reset:ordered}.ui.ordered.steps .step:before{display:block;position:static;text-align:center;content:counter(ordered);-ms-flex-item-align:middle;align-self:middle;margin-right:1rem;font-size:2.5em;counter-increment:ordered;font-family:inherit;font-weight:700}.ui.ordered.steps .step>*{display:block;-ms-flex-item-align:middle;align-self:middle}.ui.vertical.steps{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:visible}.ui.vertical.steps .step{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;border-radius:0;padding:1.16666667em 2em;border-right:none;border-bottom:1px solid rgba(34,36,38,.15)}.ui.vertical.steps .step:first-child{padding:1.16666667em 2em;border-radius:.33333333rem .33333333rem 0 0}.ui.vertical.steps .step:last-child{border-bottom:none;border-radius:0 0 .33333333rem .33333333rem}.ui.vertical.steps .step:only-child{border-radius:.33333333rem}.ui.vertical.steps .step:after{top:50%;right:0;border-width:0 1px 1px 0;display:none}.ui.right.vertical.steps .step:after{border-width:1px 0 0 1px;left:0;right:100%;-webkit-transform:translateY(-50%) translateX(-50%) rotate(-45deg);transform:translateY(-50%) translateX(-50%) rotate(-45deg)}.ui.vertical.steps .active.step:after{display:block}.ui.vertical.steps .step:last-child:after{display:none}.ui.vertical.steps .active.step:last-child:after{display:block}@media only screen and (max-width:767.98px){.ui.steps:not(.unstackable){display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;overflow:visible;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ui.steps:not(.unstackable) .step{width:100%!important;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-radius:0;padding:1.16666667em 2em;border-right:none;border-bottom:1px solid rgba(34,36,38,.15)}.ui.steps:not(.unstackable) .step:first-child{padding:1.16666667em 2em;border-radius:.33333333rem .33333333rem 0 0}.ui.steps:not(.unstackable) .step:last-child{border-radius:0 0 .33333333rem .33333333rem;border-bottom:none}.ui.steps:not(.unstackable) .step:after{top:unset;bottom:-1.16666667em;right:50%;-webkit-transform:translateY(-50%) translateX(50%) rotate(45deg);transform:translateY(-50%) translateX(50%) rotate(45deg)}.ui.vertical.steps .active.step:last-child:after{display:none}.ui.steps:not(.unstackable) .step .content{text-align:center}.ui.ordered.steps:not(.unstackable) .step:before,.ui.steps:not(.unstackable) .step>i.icon{margin:0 0 1rem 0}}.ui.steps .link.step:hover,.ui.steps .link.step:hover::after,.ui.steps a.step:hover,.ui.steps a.step:hover::after{background:#f9fafb;color:rgba(0,0,0,.8)}.ui.steps .link.step:active,.ui.steps .link.step:active::after,.ui.steps a.step:active,.ui.steps a.step:active::after{background:#f3f4f5;color:rgba(0,0,0,.9)}.ui.steps .step.active{cursor:auto;background:#f3f4f5}.ui.steps .step.active:after{background:#f3f4f5}.ui.steps .step.active .title{color:#6435c9}.ui.ordered.steps .step.active:before,.ui.steps .active.step i.icon{color:rgba(0,0,0,.85)}.ui.steps .step:after{display:block}.ui.steps .active.step:after{display:block}.ui.steps .step:last-child:after{display:none}.ui.steps .active.step:last-child:after{display:none}.ui.steps .link.active.step:hover,.ui.steps .link.active.step:hover::after,.ui.steps a.active.step:hover,.ui.steps a.active.step:hover::after{cursor:pointer;background:#dcddde;color:rgba(0,0,0,.87)}.ui.ordered.steps .step.completed:before,.ui.steps .step.completed>i.icon:before{color:#21ba45}.ui.steps .disabled.step{cursor:auto;background:#fff;pointer-events:none}.ui.steps .disabled.step,.ui.steps .disabled.step .description,.ui.steps .disabled.step .title{color:rgba(40,40,40,.3)}.ui.steps .disabled.step:after{background:#fff}@media only screen and (max-width:991.98px){.ui[class*="tablet stackable"].steps{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;overflow:visible;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ui[class*="tablet stackable"].steps .step{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-radius:0;padding:1.16666667em 2em;border-right:none;border-bottom:1px solid rgba(34,36,38,.15)}.ui[class*="tablet stackable"].steps .step:first-child{padding:1.16666667em 2em;border-radius:.33333333rem .33333333rem 0 0}.ui[class*="tablet stackable"].steps .step:last-child{border-radius:0 0 .33333333rem .33333333rem;border-bottom:none}.ui[class*="tablet stackable"].steps .step:after{top:unset;bottom:-1.16666667em;right:50%;-webkit-transform:translateY(-50%) translateX(50%) rotate(45deg);transform:translateY(-50%) translateX(50%) rotate(45deg)}.ui[class*="tablet stackable"].steps .step .content{text-align:center}.ui[class*="tablet stackable"].ordered.steps .step:before,.ui[class*="tablet stackable"].steps .step>i.icon{margin:0 0 1rem 0}}.ui.fluid.steps{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}.ui.attached.steps{width:calc(100% + 2px)!important;margin:0 -1px 0;max-width:calc(100% + 2px);border-radius:.33333333rem .33333333rem 0 0}.ui.attached.steps .step:first-child{border-radius:.33333333rem 0 0 0}.ui.attached.steps .step:last-child{border-radius:0 .33333333rem 0 0}.ui.bottom.attached.steps{margin:0 -1px 0;border-radius:0 0 .33333333rem .33333333rem}.ui.bottom.attached.steps .step:first-child{border-radius:0 0 0 .33333333rem}.ui.bottom.attached.steps .step:last-child{border-radius:0 0 .33333333rem 0}.ui.eight.steps,.ui.five.steps,.ui.four.steps,.ui.one.steps,.ui.seven.steps,.ui.six.steps,.ui.three.steps,.ui.two.steps{width:100%}.ui.eight.steps>.step,.ui.five.steps>.step,.ui.four.steps>.step,.ui.one.steps>.step,.ui.seven.steps>.step,.ui.six.steps>.step,.ui.three.steps>.step,.ui.two.steps>.step{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.ui.one.steps>.step{width:100%}.ui.two.steps>.step{width:50%}.ui.three.steps>.step{width:33.333%}.ui.four.steps>.step{width:25%}.ui.five.steps>.step{width:20%}.ui.six.steps>.step{width:16.666%}.ui.seven.steps>.step{width:14.285%}.ui.eight.steps>.step{width:12.5%}.ui.step,.ui.steps .step{font-size:1rem}.ui.mini.step,.ui.mini.steps .step{font-size:.75rem}.ui.tiny.step,.ui.tiny.steps .step{font-size:.83333333rem}.ui.small.step,.ui.small.steps .step{font-size:.91666667rem}.ui.large.step,.ui.large.steps .step{font-size:1.16666667rem}.ui.big.step,.ui.big.steps .step{font-size:1.25rem}.ui.huge.step,.ui.huge.steps .step{font-size:1.41666667rem}.ui.massive.step,.ui.massive.steps .step{font-size:1.75rem}.ui.inverted.steps{border:1px solid #555}.ui.inverted.steps .step{color:rgba(255,255,255,.9);background:#1b1c1d;border-color:#555}.ui.inverted.steps .step:after{background-color:#1b1c1d;border-color:#555}.ui.inverted.steps .step .description{color:rgba(255,255,255,.9)}.ui.inverted.steps .step.active,.ui.inverted.steps .step.active:after{background:#333}.ui.inverted.ordered.steps .step.active:before,.ui.inverted.steps .active.step i.icon{color:#fff}.ui.inverted.steps .disabled.step,.ui.inverted.steps .disabled.step:after{background:#222}.ui.inverted.steps .disabled.step,.ui.inverted.steps .disabled.step .description,.ui.inverted.steps .disabled.step .title{color:rgba(225,225,225,.3)}.ui.inverted.steps .link.step:hover,.ui.inverted.steps .link.step:hover::after,.ui.inverted.steps a.step:hover,.ui.inverted.steps a.step:hover::after{background:#3f3f3f;color:#fff}.ui.inverted.steps .link.step:active,.ui.inverted.steps .link.step:active::after,.ui.inverted.steps a.step:active,.ui.inverted.steps a.step:active::after{background:#444;color:#fff}@font-face{font-family:Step;src:url(data:application/x-font-ttf;charset=utf-8;;base64,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) format('truetype'),url(data:application/font-woff;charset=utf-8;base64,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) format('woff')}.ui.ordered.steps .step.completed:before,.ui.steps .step.completed>.icon:before{font-family:Step;content:'\e800'} \ No newline at end of file diff --git a/semantic/dist/semantic.css b/semantic/dist/semantic.css index eba7f256..bf901c86 100644 --- a/semantic/dist/semantic.css +++ b/semantic/dist/semantic.css @@ -8202,6 +8202,198 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover { /******************************* Site Overrides *******************************/ +/*! + * # Fomantic-UI 2.8.8 - Calendar + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Popup +*******************************/ + +.ui.calendar .ui.popup { + max-width: none; + padding: 0; + border: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +/******************************* + Calendar +*******************************/ + +.ui.calendar .calendar:focus { + outline: 0; +} + +/******************************* + Grid +*******************************/ + +.ui.calendar .ui.popup .ui.grid { + display: block; + white-space: nowrap; +} + +.ui.calendar .ui.popup .ui.grid > .column { + width: auto; +} + +/******************************* + Table +*******************************/ + +.ui.calendar .ui.table.year, +.ui.calendar .ui.table.month, +.ui.calendar .ui.table.minute { + min-width: 15em; +} + +.ui.calendar .ui.table.day { + min-width: 18em; +} + +.ui.calendar .ui.table.day.andweek { + min-width: 22em; +} + +.ui.calendar .ui.table.hour { + min-width: 20em; +} + +.ui.calendar .ui.table tr th, +.ui.calendar .ui.table tr td { + padding: 0.5em; + white-space: nowrap; + text-align: center; +} + +.ui.calendar .ui.table tr th { + border-left: none; +} + +.ui.calendar .ui.table tr th i.icon { + margin: 0; +} + +.ui.calendar .ui.table tr:first-child th { + position: relative; + padding-left: 0; + padding-right: 0; +} + +.ui.calendar .ui.table.day tr:first-child th { + border: none; +} + +.ui.calendar .ui.table.day tr:nth-child(2) th { + padding-top: 0.2em; + padding-bottom: 0.3em; +} + +.ui.calendar .ui.table tr td { + padding-left: 0.1em; + padding-right: 0.1em; +} + +.ui.calendar .ui.table tr .link { + cursor: pointer; +} + +.ui.calendar .ui.table tr .prev.link { + width: 14.28571429%; + position: absolute; + left: 0; +} + +.ui.calendar .ui.table tr .next.link { + width: 14.28571429%; + position: absolute; + right: 0; +} + +.ui.ui.calendar .ui.table tr .disabled { + pointer-events: auto; + cursor: default; + color: rgba(40, 40, 40, 0.3); +} + +.ui.calendar .ui.table tr .adjacent:not(.disabled):not(.active) { + color: rgba(0, 0, 0, 0.6); + background: rgba(0, 0, 0, 0.03); +} + +/*-------------- + States +---------------*/ + +.ui.calendar .ui.table tr td.today { + font-weight: bold; +} + +.ui.calendar .ui.table tr td.range { + background: rgba(0, 0, 0, 0.05); + color: rgba(0, 0, 0, 0.95); + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.calendar:not(.disabled) .calendar:focus .ui.table tbody tr td.focus, +.ui.calendar:not(.disabled) .calendar.active .ui.table tbody tr td.focus { + -webkit-box-shadow: inset 0 0 0 1px #6435C9; + box-shadow: inset 0 0 0 1px #6435C9; +} + +.ui.inverted.calendar .ui.table.inverted tr td.range { + background: rgba(255, 255, 255, 0.08); + color: #ffffff; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.inverted.calendar:not(.disabled) .calendar:focus .ui.table.inverted tbody tr td.focus, +.ui.inverted.calendar:not(.disabled) .calendar.active .ui.table.inverted tbody tr td.focus { + -webkit-box-shadow: inset 0 0 0 1px #6435C9; + box-shadow: inset 0 0 0 1px #6435C9; +} + +.ui.inverted.calendar .ui.inverted.table tr .disabled { + color: rgba(225, 225, 225, 0.3); +} + +.ui.inverted.calendar .ui.inverted.table tr .adjacent:not(.disabled):not(.active) { + color: rgba(255, 255, 255, 0.8); + background: rgba(255, 255, 255, 0.02); +} + +/******************************* + States +*******************************/ + +/*-------------------- + Disabled + ---------------------*/ + +.ui.disabled.calendar { + opacity: 0.45; +} + +.ui.disabled.calendar > .input, +.ui.disabled.calendar .ui.table tr .link { + pointer-events: none; +} + +/******************************* + Theme Overrides +*******************************/ /*! * # Fomantic-UI 2.8.8 - Card * http://github.com/fomantic/Fomantic-UI/ @@ -9762,320 +9954,6 @@ a.inverted.ui.card:hover, /******************************* User Variable Overrides *******************************/ -/*! - * # Fomantic-UI 2.8.8 - Divider - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Divider -*******************************/ - -.ui.divider { - margin: 1rem 0; - line-height: 1; - height: 0; - font-weight: bold; - text-transform: uppercase; - letter-spacing: 0.05em; - color: rgba(0, 0, 0, 0.85); - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -} - -/*-------------- - Basic ----------------*/ - -.ui.divider:not(.vertical):not(.horizontal) { - border-top: 1px solid rgba(34, 36, 38, 0.15); - border-bottom: 1px solid rgba(255, 255, 255, 0.1); -} - -/*-------------- - Coupling ----------------*/ - -/* Allow divider between each column row */ - -.ui.grid > .column + .divider, -.ui.grid > .row > .column + .divider { - left: auto; -} - -/*-------------- - Horizontal - ---------------*/ - -.ui.horizontal.divider { - display: table; - white-space: nowrap; - height: auto; - margin: ''; - line-height: 1; - text-align: center; -} - -.ui.horizontal.divider:before, -.ui.horizontal.divider:after { - content: ''; - display: table-cell; - position: relative; - top: 50%; - width: 50%; - background-repeat: no-repeat; -} - -.ui.horizontal.divider:before { - background-position: right 1em top 50%; -} - -.ui.horizontal.divider:after { - background-position: left 1em top 50%; -} - -/*-------------- - Vertical - ---------------*/ - -.ui.vertical.divider { - position: absolute; - z-index: 2; - top: 50%; - left: 50%; - margin: 0; - padding: 0; - width: auto; - height: 50%; - line-height: 0; - text-align: center; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); -} - -.ui.vertical.divider:before, -.ui.vertical.divider:after { - position: absolute; - left: 50%; - content: ''; - z-index: 3; - border-left: 1px solid rgba(34, 36, 38, 0.15); - border-right: 1px solid rgba(255, 255, 255, 0.1); - width: 0; - height: calc(100% - 1rem); -} - -.ui.vertical.divider:before { - top: -100%; -} - -.ui.vertical.divider:after { - top: auto; - bottom: 0; -} - -/* Inside grid */ - -@media only screen and (max-width: 767.98px) { - .ui.stackable.grid .ui.vertical.divider, - .ui.grid .stackable.row .ui.vertical.divider { - display: table; - white-space: nowrap; - height: auto; - margin: ''; - overflow: hidden; - line-height: 1; - text-align: center; - position: static; - top: 0; - left: 0; - -webkit-transform: none; - transform: none; - } - - .ui.stackable.grid .ui.vertical.divider:before, - .ui.grid .stackable.row .ui.vertical.divider:before, - .ui.stackable.grid .ui.vertical.divider:after, - .ui.grid .stackable.row .ui.vertical.divider:after { - left: 0; - border-left: none; - border-right: none; - content: ''; - display: table-cell; - position: relative; - top: 50%; - width: 50%; - background-repeat: no-repeat; - } - - .ui.stackable.grid .ui.vertical.divider:before, - .ui.grid .stackable.row .ui.vertical.divider:before { - background-position: right 1em top 50%; - } - - .ui.stackable.grid .ui.vertical.divider:after, - .ui.grid .stackable.row .ui.vertical.divider:after { - background-position: left 1em top 50%; - } -} - -/*-------------- - Icon - ---------------*/ - -.ui.divider > .icon { - margin: 0; - font-size: 1rem; - height: 1em; - vertical-align: middle; -} - -/*-------------- - Header - ---------------*/ - -.ui.horizontal.divider[class*="left aligned"]:before { - display: none; -} - -.ui.horizontal.divider[class*="left aligned"]:after { - width: 100%; -} - -.ui.horizontal.divider[class*="right aligned"]:before { - width: 100%; -} - -.ui.horizontal.divider[class*="right aligned"]:after { - display: none; -} - -/******************************* - Variations -*******************************/ - -/*-------------- - Hidden - ---------------*/ - -.ui.hidden.divider { - border-color: transparent !important; -} - -.ui.hidden.divider:before, -.ui.hidden.divider:after { - display: none; -} - -/*-------------- - Inverted ----------------*/ - -.ui.divider.inverted, -.ui.vertical.inverted.divider, -.ui.horizontal.inverted.divider { - color: #FFFFFF; -} - -.ui.divider.inverted, -.ui.divider.inverted:after, -.ui.divider.inverted:before { - border-top-color: rgba(34, 36, 38, 0.15) !important; - border-left-color: rgba(34, 36, 38, 0.15) !important; - border-bottom-color: rgba(255, 255, 255, 0.15) !important; - border-right-color: rgba(255, 255, 255, 0.15) !important; -} - -/*-------------- - Fitted ----------------*/ - -.ui.fitted.divider { - margin: 0; -} - -/*-------------- - Clearing - ---------------*/ - -.ui.clearing.divider { - clear: both; -} - -/*-------------- - Section - ---------------*/ - -.ui.section.divider { - margin-top: 2rem; - margin-bottom: 2rem; -} - -/*-------------- - Sizes ----------------*/ - -.ui.divider { - font-size: 1rem; -} - -.ui.mini.divider { - font-size: 0.75rem; -} - -.ui.tiny.divider { - font-size: 0.83333333rem; -} - -.ui.small.divider { - font-size: 0.91666667rem; -} - -.ui.large.divider { - font-size: 1.16666667rem; -} - -.ui.big.divider { - font-size: 1.25rem; -} - -.ui.huge.divider { - font-size: 1.41666667rem; -} - -.ui.massive.divider { - font-size: 1.75rem; -} - -/******************************* - Theme Overrides -*******************************/ - -.ui.horizontal.divider:before, -.ui.horizontal.divider:after { - background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); -} - -@media only screen and (max-width: 767px) { - .ui.stackable.grid .ui.vertical.divider:before, - .ui.grid .stackable.row .ui.vertical.divider:before, - .ui.stackable.grid .ui.vertical.divider:after, - .ui.grid .stackable.row .ui.vertical.divider:after { - background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); - } -} - -/******************************* - Site Overrides -*******************************/ /*! * # Fomantic-UI 2.8.8 - Dimmer * http://github.com/fomantic/Fomantic-UI/ @@ -10584,6 +10462,320 @@ body.dimmable > .dimmer { /******************************* User Overrides *******************************/ +/*! + * # Fomantic-UI 2.8.8 - Divider + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Divider +*******************************/ + +.ui.divider { + margin: 1rem 0; + line-height: 1; + height: 0; + font-weight: bold; + text-transform: uppercase; + letter-spacing: 0.05em; + color: rgba(0, 0, 0, 0.85); + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); +} + +/*-------------- + Basic +---------------*/ + +.ui.divider:not(.vertical):not(.horizontal) { + border-top: 1px solid rgba(34, 36, 38, 0.15); + border-bottom: 1px solid rgba(255, 255, 255, 0.1); +} + +/*-------------- + Coupling +---------------*/ + +/* Allow divider between each column row */ + +.ui.grid > .column + .divider, +.ui.grid > .row > .column + .divider { + left: auto; +} + +/*-------------- + Horizontal + ---------------*/ + +.ui.horizontal.divider { + display: table; + white-space: nowrap; + height: auto; + margin: ''; + line-height: 1; + text-align: center; +} + +.ui.horizontal.divider:before, +.ui.horizontal.divider:after { + content: ''; + display: table-cell; + position: relative; + top: 50%; + width: 50%; + background-repeat: no-repeat; +} + +.ui.horizontal.divider:before { + background-position: right 1em top 50%; +} + +.ui.horizontal.divider:after { + background-position: left 1em top 50%; +} + +/*-------------- + Vertical + ---------------*/ + +.ui.vertical.divider { + position: absolute; + z-index: 2; + top: 50%; + left: 50%; + margin: 0; + padding: 0; + width: auto; + height: 50%; + line-height: 0; + text-align: center; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); +} + +.ui.vertical.divider:before, +.ui.vertical.divider:after { + position: absolute; + left: 50%; + content: ''; + z-index: 3; + border-left: 1px solid rgba(34, 36, 38, 0.15); + border-right: 1px solid rgba(255, 255, 255, 0.1); + width: 0; + height: calc(100% - 1rem); +} + +.ui.vertical.divider:before { + top: -100%; +} + +.ui.vertical.divider:after { + top: auto; + bottom: 0; +} + +/* Inside grid */ + +@media only screen and (max-width: 767.98px) { + .ui.stackable.grid .ui.vertical.divider, + .ui.grid .stackable.row .ui.vertical.divider { + display: table; + white-space: nowrap; + height: auto; + margin: ''; + overflow: hidden; + line-height: 1; + text-align: center; + position: static; + top: 0; + left: 0; + -webkit-transform: none; + transform: none; + } + + .ui.stackable.grid .ui.vertical.divider:before, + .ui.grid .stackable.row .ui.vertical.divider:before, + .ui.stackable.grid .ui.vertical.divider:after, + .ui.grid .stackable.row .ui.vertical.divider:after { + left: 0; + border-left: none; + border-right: none; + content: ''; + display: table-cell; + position: relative; + top: 50%; + width: 50%; + background-repeat: no-repeat; + } + + .ui.stackable.grid .ui.vertical.divider:before, + .ui.grid .stackable.row .ui.vertical.divider:before { + background-position: right 1em top 50%; + } + + .ui.stackable.grid .ui.vertical.divider:after, + .ui.grid .stackable.row .ui.vertical.divider:after { + background-position: left 1em top 50%; + } +} + +/*-------------- + Icon + ---------------*/ + +.ui.divider > .icon { + margin: 0; + font-size: 1rem; + height: 1em; + vertical-align: middle; +} + +/*-------------- + Header + ---------------*/ + +.ui.horizontal.divider[class*="left aligned"]:before { + display: none; +} + +.ui.horizontal.divider[class*="left aligned"]:after { + width: 100%; +} + +.ui.horizontal.divider[class*="right aligned"]:before { + width: 100%; +} + +.ui.horizontal.divider[class*="right aligned"]:after { + display: none; +} + +/******************************* + Variations +*******************************/ + +/*-------------- + Hidden + ---------------*/ + +.ui.hidden.divider { + border-color: transparent !important; +} + +.ui.hidden.divider:before, +.ui.hidden.divider:after { + display: none; +} + +/*-------------- + Inverted +---------------*/ + +.ui.divider.inverted, +.ui.vertical.inverted.divider, +.ui.horizontal.inverted.divider { + color: #FFFFFF; +} + +.ui.divider.inverted, +.ui.divider.inverted:after, +.ui.divider.inverted:before { + border-top-color: rgba(34, 36, 38, 0.15) !important; + border-left-color: rgba(34, 36, 38, 0.15) !important; + border-bottom-color: rgba(255, 255, 255, 0.15) !important; + border-right-color: rgba(255, 255, 255, 0.15) !important; +} + +/*-------------- + Fitted +---------------*/ + +.ui.fitted.divider { + margin: 0; +} + +/*-------------- + Clearing + ---------------*/ + +.ui.clearing.divider { + clear: both; +} + +/*-------------- + Section + ---------------*/ + +.ui.section.divider { + margin-top: 2rem; + margin-bottom: 2rem; +} + +/*-------------- + Sizes +---------------*/ + +.ui.divider { + font-size: 1rem; +} + +.ui.mini.divider { + font-size: 0.75rem; +} + +.ui.tiny.divider { + font-size: 0.83333333rem; +} + +.ui.small.divider { + font-size: 0.91666667rem; +} + +.ui.large.divider { + font-size: 1.16666667rem; +} + +.ui.big.divider { + font-size: 1.25rem; +} + +.ui.huge.divider { + font-size: 1.41666667rem; +} + +.ui.massive.divider { + font-size: 1.75rem; +} + +/******************************* + Theme Overrides +*******************************/ + +.ui.horizontal.divider:before, +.ui.horizontal.divider:after { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); +} + +@media only screen and (max-width: 767px) { + .ui.stackable.grid .ui.vertical.divider:before, + .ui.grid .stackable.row .ui.vertical.divider:before, + .ui.stackable.grid .ui.vertical.divider:after, + .ui.grid .stackable.row .ui.vertical.divider:after { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); + } +} + +/******************************* + Site Overrides +*******************************/ /*! * # Fomantic-UI 2.8.8 - Dropdown * http://github.com/fomantic/Fomantic-UI/ @@ -12897,6 +13089,2009 @@ select.ui.dropdown { /******************************* User Overrides *******************************/ +/*! + * # Fomantic-UI 2.8.8 - Form + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Elements +*******************************/ + +/*-------------------- + Form +---------------------*/ + +.ui.form { + position: relative; + max-width: 100%; +} + +/*-------------------- + Content +---------------------*/ + +.ui.form > p { + margin: 1em 0; +} + +/*-------------------- + Field +---------------------*/ + +.ui.form .field { + clear: both; + margin: 0 0 1em; +} + +.ui.form .fields .fields, +.ui.form .field:last-child, +.ui.form .fields:last-child .field { + margin-bottom: 0; +} + +.ui.form .fields .field { + clear: both; + margin: 0; +} + +/*-------------------- + Labels +---------------------*/ + +.ui.form .field > label { + display: block; + margin: 0 0 0.33333333rem 0; + color: rgba(0, 0, 0, 0.87); + font-size: 0.91666667em; + font-weight: bold; + text-transform: none; +} + +/*-------------------- + Standard Inputs +---------------------*/ + +.ui.form textarea, +.ui.form input:not([type]), +.ui.form input[type="date"], +.ui.form input[type="datetime-local"], +.ui.form input[type="email"], +.ui.form input[type="number"], +.ui.form input[type="password"], +.ui.form input[type="search"], +.ui.form input[type="tel"], +.ui.form input[type="time"], +.ui.form input[type="text"], +.ui.form input[type="file"], +.ui.form input[type="url"] { + width: 100%; + vertical-align: top; +} + +/* Set max height on unusual input */ + +.ui.form ::-webkit-datetime-edit, +.ui.form ::-webkit-inner-spin-button { + height: 1.21428571em; +} + +.ui.form input:not([type]), +.ui.form input[type="date"], +.ui.form input[type="datetime-local"], +.ui.form input[type="email"], +.ui.form input[type="number"], +.ui.form input[type="password"], +.ui.form input[type="search"], +.ui.form input[type="tel"], +.ui.form input[type="time"], +.ui.form input[type="text"], +.ui.form input[type="file"], +.ui.form input[type="url"] { + font-family: 'Raleway', sans-serif; + margin: 0; + outline: none; + -webkit-appearance: none; + -webkit-tap-highlight-color: rgba(255, 255, 255, 0); + line-height: 1.21428571em; + padding: 0.80952381em 1.16666667em; + font-size: 1em; + background: #FFFFFF; + border: 1px solid rgba(34, 36, 38, 0.15); + color: rgba(0, 0, 0, 0.87); + border-radius: 0.33333333rem; + -webkit-box-shadow: 0 0 0 0 transparent inset; + box-shadow: 0 0 0 0 transparent inset; + -webkit-transition: color 0.1s ease, border-color 0.1s ease; + transition: color 0.1s ease, border-color 0.1s ease; +} + +/* Text Area */ + +.ui.input textarea, +.ui.form textarea { + margin: 0; + -webkit-appearance: none; + -webkit-tap-highlight-color: rgba(255, 255, 255, 0); + padding: 0.91666667em 1.16666667em; + background: #FFFFFF; + border: 1px solid rgba(34, 36, 38, 0.15); + outline: none; + color: rgba(0, 0, 0, 0.87); + border-radius: 0.33333333rem; + -webkit-box-shadow: 0 0 0 0 transparent inset; + box-shadow: 0 0 0 0 transparent inset; + -webkit-transition: color 0.1s ease, border-color 0.1s ease; + transition: color 0.1s ease, border-color 0.1s ease; + font-size: 1em; + font-family: 'Raleway', sans-serif; + line-height: 1.2857; + resize: vertical; +} + +.ui.form textarea:not([rows]) { + height: 12em; + min-height: 8em; + max-height: 24em; +} + +.ui.form textarea, +.ui.form input[type="checkbox"] { + vertical-align: top; +} + +/*-------------------- + Checkbox margin +---------------------*/ + +.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) label + .ui.ui.checkbox { + margin-top: 0.7em; +} + +.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.checkbox { + margin-top: 2.41428571em; +} + +.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.toggle.checkbox { + margin-top: 2.21428571em; +} + +.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.slider.checkbox { + margin-top: 2.61428571em; +} + +.ui.ui.form .field .fields .field:not(:only-child) .ui.checkbox { + margin-top: 0.6em; +} + +.ui.ui.form .field .fields .field:not(:only-child) .ui.toggle.checkbox { + margin-top: 0.5em; +} + +.ui.ui.form .field .fields .field:not(:only-child) .ui.slider.checkbox { + margin-top: 0.7em; +} + +/*-------------------- + Transparent + ---------------------*/ + +.ui.form .field .transparent.input:not(.icon) input, +.ui.form .field input.transparent, +.ui.form .field textarea.transparent { + padding: 0.80952381em 1.16666667em; +} + +.ui.form .field input.transparent, +.ui.form .field textarea.transparent { + border-color: transparent !important; + background-color: transparent !important; + -webkit-box-shadow: none !important; + box-shadow: none !important; +} + +/*-------------------------- + Input w/ attached Button +---------------------------*/ + +.ui.form input.attached { + width: auto; +} + +/*-------------------- + Basic Select +---------------------*/ + +.ui.form select { + display: block; + height: auto; + width: 100%; + background: #FFFFFF; + border: 1px solid rgba(34, 36, 38, 0.15); + border-radius: 0.33333333rem; + -webkit-box-shadow: 0 0 0 0 transparent inset; + box-shadow: 0 0 0 0 transparent inset; + padding: 0.62em 1.16666667em; + color: rgba(0, 0, 0, 0.87); + -webkit-transition: color 0.1s ease, border-color 0.1s ease; + transition: color 0.1s ease, border-color 0.1s ease; +} + +/*-------------------- + Dropdown +---------------------*/ + +/* Block */ + +.ui.form .field > .selection.dropdown { + min-width: auto; + width: 100%; +} + +.ui.form .field > .selection.dropdown > .dropdown.icon { + float: right; +} + +/* Inline */ + +.ui.form .inline.fields .field > .selection.dropdown, +.ui.form .inline.field > .selection.dropdown { + width: auto; +} + +.ui.form .inline.fields .field > .selection.dropdown > .dropdown.icon, +.ui.form .inline.field > .selection.dropdown > .dropdown.icon { + float: none; +} + +/*-------------------- + UI Input +---------------------*/ + +/* Block */ + +.ui.form .field .ui.input, +.ui.form .fields .field .ui.input, +.ui.form .wide.field .ui.input { + width: 100%; +} + +/* Inline */ + +.ui.form .inline.fields .field:not(.wide) .ui.input, +.ui.form .inline.field:not(.wide) .ui.input { + width: auto; + vertical-align: middle; +} + +/* Auto Input */ + +.ui.form .fields .field .ui.input input, +.ui.form .field .ui.input input { + width: auto; +} + +/* Full Width Input */ + +.ui.form .ten.fields .ui.input input, +.ui.form .nine.fields .ui.input input, +.ui.form .eight.fields .ui.input input, +.ui.form .seven.fields .ui.input input, +.ui.form .six.fields .ui.input input, +.ui.form .five.fields .ui.input input, +.ui.form .four.fields .ui.input input, +.ui.form .three.fields .ui.input input, +.ui.form .two.fields .ui.input input, +.ui.form .wide.field .ui.input input { + -webkit-box-flex: 1; + -ms-flex: 1 0 auto; + flex: 1 0 auto; + width: 0; +} + +/*-------------------- + Types of Messages +---------------------*/ + +.ui.form .error.message, +.ui.form .error.message:empty { + display: none; +} + +.ui.form .info.message, +.ui.form .info.message:empty { + display: none; +} + +.ui.form .success.message, +.ui.form .success.message:empty { + display: none; +} + +.ui.form .warning.message, +.ui.form .warning.message:empty { + display: none; +} + +/* Assumptions */ + +.ui.form .message:first-child { + margin-top: 0; +} + +/*-------------------- + Validation Prompt +---------------------*/ + +.ui.form .field .prompt.label { + white-space: normal; + background: #FFFFFF !important; + border: 1px solid #E0B4B4 !important; + color: #9F3A38 !important; +} + +.ui.form .inline.fields .field .prompt, +.ui.form .inline.field .prompt { + vertical-align: top; + margin: -0.25em 0 -0.5em 0.5em; +} + +.ui.form .inline.fields .field .prompt:before, +.ui.form .inline.field .prompt:before { + border-width: 0 0 1px 1px; + bottom: auto; + right: auto; + top: 50%; + left: 0; +} + +/******************************* + States +*******************************/ + +/*-------------------- + Autofilled +---------------------*/ + +.ui.form .field.field input:-webkit-autofill { + -webkit-box-shadow: 0 0 0 100px #FFFFF0 inset !important; + box-shadow: 0 0 0 100px #FFFFF0 inset !important; + border-color: #E5DFA1 !important; +} + +/* Focus */ + +.ui.form .field.field input:-webkit-autofill:focus { + -webkit-box-shadow: 0 0 0 100px #FFFFF0 inset !important; + box-shadow: 0 0 0 100px #FFFFF0 inset !important; + border-color: #D5C315 !important; +} + +/*-------------------- + Placeholder +---------------------*/ + +/* browsers require these rules separate */ + +.ui.form ::-webkit-input-placeholder { + color: rgba(191, 191, 191, 0.87); +} + +.ui.form :-ms-input-placeholder { + color: rgba(191, 191, 191, 0.87) !important; +} + +.ui.form ::-moz-placeholder { + color: rgba(191, 191, 191, 0.87); + opacity: 1; +} + +.ui.form :focus::-webkit-input-placeholder { + color: rgba(115, 115, 115, 0.87); +} + +.ui.form :focus:-ms-input-placeholder { + color: rgba(115, 115, 115, 0.87) !important; +} + +.ui.form :focus::-moz-placeholder { + color: rgba(115, 115, 115, 0.87); +} + +/*-------------------- + Focus +---------------------*/ + +.ui.form input:not([type]):focus, +.ui.form input[type="date"]:focus, +.ui.form input[type="datetime-local"]:focus, +.ui.form input[type="email"]:focus, +.ui.form input[type="number"]:focus, +.ui.form input[type="password"]:focus, +.ui.form input[type="search"]:focus, +.ui.form input[type="tel"]:focus, +.ui.form input[type="time"]:focus, +.ui.form input[type="text"]:focus, +.ui.form input[type="file"]:focus, +.ui.form input[type="url"]:focus { + color: rgba(0, 0, 0, 0.95); + border-color: #6435C9; + border-radius: 0.33333333rem; + background: #FFFFFF; + -webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; + box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; +} + +.ui.form .ui.action.input:not([class*="left action"]) input:not([type]):focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="date"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="datetime-local"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="email"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="number"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="password"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="search"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="tel"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="time"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="text"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="file"]:focus, +.ui.form .ui.action.input:not([class*="left action"]) input[type="url"]:focus { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.ui.form .ui[class*="left action"].input input:not([type]), +.ui.form .ui[class*="left action"].input input[type="date"], +.ui.form .ui[class*="left action"].input input[type="datetime-local"], +.ui.form .ui[class*="left action"].input input[type="email"], +.ui.form .ui[class*="left action"].input input[type="number"], +.ui.form .ui[class*="left action"].input input[type="password"], +.ui.form .ui[class*="left action"].input input[type="search"], +.ui.form .ui[class*="left action"].input input[type="tel"], +.ui.form .ui[class*="left action"].input input[type="time"], +.ui.form .ui[class*="left action"].input input[type="text"], +.ui.form .ui[class*="left action"].input input[type="file"], +.ui.form .ui[class*="left action"].input input[type="url"] { + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} + +.ui.form textarea:focus { + color: rgba(0, 0, 0, 0.95); + border-color: #6435C9; + border-radius: 0.33333333rem; + background: #FFFFFF; + -webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; + box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; + -webkit-appearance: none; +} + +/*-------------------- + States + ---------------------*/ + +/* On Form */ + +.ui.form.error .error.message:not(:empty) { + display: block; +} + +.ui.form.error .compact.error.message:not(:empty) { + display: inline-block; +} + +.ui.form.error .icon.error.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +/* On Field(s) */ + +.ui.form .fields.error .error.message:not(:empty), +.ui.form .field.error .error.message:not(:empty) { + display: block; +} + +.ui.form .fields.error .compact.error.message:not(:empty), +.ui.form .field.error .compact.error.message:not(:empty) { + display: inline-block; +} + +.ui.form .fields.error .icon.error.message:not(:empty), +.ui.form .field.error .icon.error.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +.ui.ui.form .fields.error .field label, +.ui.ui.form .fields.error .field .ui.label:not(.corner), +.ui.ui.form .field.error label, +.ui.ui.form .field.error .ui.label:not(.corner), +.ui.ui.form .fields.error .field .input, +.ui.ui.form .field.error .input { + color: #9F3A38; +} + +.ui.form .fields.error .field .ui.label, +.ui.form .field.error .ui.label { + background-color: #ecd1d1; +} + +.ui.form .fields.error .field .corner.label, +.ui.form .field.error .corner.label { + border-color: #9F3A38; + color: #FFFFFF; +} + +.ui.form .fields.error .field textarea, +.ui.form .fields.error .field select, +.ui.form .fields.error .field input:not([type]), +.ui.form .fields.error .field input[type="date"], +.ui.form .fields.error .field input[type="datetime-local"], +.ui.form .fields.error .field input[type="email"], +.ui.form .fields.error .field input[type="number"], +.ui.form .fields.error .field input[type="password"], +.ui.form .fields.error .field input[type="search"], +.ui.form .fields.error .field input[type="tel"], +.ui.form .fields.error .field input[type="time"], +.ui.form .fields.error .field input[type="text"], +.ui.form .fields.error .field input[type="file"], +.ui.form .fields.error .field input[type="url"], +.ui.form .field.error textarea, +.ui.form .field.error select, +.ui.form .field.error input:not([type]), +.ui.form .field.error input[type="date"], +.ui.form .field.error input[type="datetime-local"], +.ui.form .field.error input[type="email"], +.ui.form .field.error input[type="number"], +.ui.form .field.error input[type="password"], +.ui.form .field.error input[type="search"], +.ui.form .field.error input[type="tel"], +.ui.form .field.error input[type="time"], +.ui.form .field.error input[type="text"], +.ui.form .field.error input[type="file"], +.ui.form .field.error input[type="url"] { + color: #9F3A38; + background: #FFF6F6; + border-color: #E0B4B4; + border-radius: ''; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.form .field.error textarea:focus, +.ui.form .field.error select:focus, +.ui.form .field.error input:not([type]):focus, +.ui.form .field.error input[type="date"]:focus, +.ui.form .field.error input[type="datetime-local"]:focus, +.ui.form .field.error input[type="email"]:focus, +.ui.form .field.error input[type="number"]:focus, +.ui.form .field.error input[type="password"]:focus, +.ui.form .field.error input[type="search"]:focus, +.ui.form .field.error input[type="tel"]:focus, +.ui.form .field.error input[type="time"]:focus, +.ui.form .field.error input[type="text"]:focus, +.ui.form .field.error input[type="file"]:focus, +.ui.form .field.error input[type="url"]:focus { + background: #FFF6F6; + border-color: #E0B4B4; + color: #9F3A38; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Preserve Native Select Stylings */ + +.ui.form .field.error select { + -webkit-appearance: menulist-button; +} + +/*------------------ + Input State + --------------------*/ + +/* Transparent */ + +.ui.form .field.error .transparent.input input, +.ui.form .field.error .transparent.input textarea, +.ui.form .field.error input.transparent, +.ui.form .field.error textarea.transparent { + background-color: #FFF6F6 !important; + color: #9F3A38 !important; +} + +/* Autofilled */ + +.ui.form .error.error input:-webkit-autofill { + -webkit-box-shadow: 0 0 0 100px #FFFAF0 inset !important; + box-shadow: 0 0 0 100px #FFFAF0 inset !important; + border-color: #E0B4B4 !important; +} + +/* Placeholder */ + +.ui.form .error ::-webkit-input-placeholder { + color: #e7bdbc; +} + +.ui.form .error :-ms-input-placeholder { + color: #e7bdbc !important; +} + +.ui.form .error ::-moz-placeholder { + color: #e7bdbc; +} + +.ui.form .error :focus::-webkit-input-placeholder { + color: #da9796; +} + +.ui.form .error :focus:-ms-input-placeholder { + color: #da9796 !important; +} + +.ui.form .error :focus::-moz-placeholder { + color: #da9796; +} + +/*------------------ + Dropdown State + --------------------*/ + +.ui.form .fields.error .field .ui.dropdown, +.ui.form .fields.error .field .ui.dropdown .item, +.ui.form .field.error .ui.dropdown, +.ui.form .field.error .ui.dropdown > .text, +.ui.form .field.error .ui.dropdown .item { + background: #FFF6F6; + color: #9F3A38; +} + +.ui.form .fields.error .field .ui.dropdown, +.ui.form .field.error .ui.dropdown { + border-color: #E0B4B4 !important; +} + +.ui.form .fields.error .field .ui.dropdown:hover, +.ui.form .field.error .ui.dropdown:hover { + border-color: #E0B4B4 !important; +} + +.ui.form .fields.error .field .ui.dropdown:hover .menu, +.ui.form .field.error .ui.dropdown:hover .menu { + border-color: #E0B4B4; +} + +.ui.form .fields.error .field .ui.multiple.selection.dropdown > .label, +.ui.form .field.error .ui.multiple.selection.dropdown > .label { + background-color: #EACBCB; + color: #9F3A38; +} + +/* Hover */ + +.ui.form .fields.error .field .ui.dropdown .menu .item:hover, +.ui.form .field.error .ui.dropdown .menu .item:hover { + background-color: #FBE7E7; +} + +/* Selected */ + +.ui.form .fields.error .field .ui.dropdown .menu .selected.item, +.ui.form .field.error .ui.dropdown .menu .selected.item { + background-color: #FBE7E7; +} + +/* Active */ + +.ui.form .fields.error .field .ui.dropdown .menu .active.item, +.ui.form .field.error .ui.dropdown .menu .active.item { + background-color: #FDCFCF !important; +} + +/*-------------------- + Checkbox State + ---------------------*/ + +.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label, +.ui.form .field.error .checkbox:not(.toggle):not(.slider) label, +.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box, +.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box { + color: #9F3A38; +} + +.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .field.error .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box:before, +.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box:before { + background: #FFF6F6; + border-color: #E0B4B4; +} + +.ui.form .fields.error .field .checkbox label:after, +.ui.form .field.error .checkbox label:after, +.ui.form .fields.error .field .checkbox .box:after, +.ui.form .field.error .checkbox .box:after { + color: #9F3A38; +} + +.ui.inverted.form .fields.error .field label, +.ui.inverted.form .error.field label { + color: #ecd1d1; +} + +/* On Form */ + +.ui.form.info .info.message:not(:empty) { + display: block; +} + +.ui.form.info .compact.info.message:not(:empty) { + display: inline-block; +} + +.ui.form.info .icon.info.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +/* On Field(s) */ + +.ui.form .fields.info .info.message:not(:empty), +.ui.form .field.info .info.message:not(:empty) { + display: block; +} + +.ui.form .fields.info .compact.info.message:not(:empty), +.ui.form .field.info .compact.info.message:not(:empty) { + display: inline-block; +} + +.ui.form .fields.info .icon.info.message:not(:empty), +.ui.form .field.info .icon.info.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +.ui.ui.form .fields.info .field label, +.ui.ui.form .fields.info .field .ui.label:not(.corner), +.ui.ui.form .field.info label, +.ui.ui.form .field.info .ui.label:not(.corner), +.ui.ui.form .fields.info .field .input, +.ui.ui.form .field.info .input { + color: #276F86; +} + +.ui.form .fields.info .field .ui.label, +.ui.form .field.info .ui.label { + background-color: #c6e3e9; +} + +.ui.form .fields.info .field .corner.label, +.ui.form .field.info .corner.label { + border-color: #276F86; + color: #FFFFFF; +} + +.ui.form .fields.info .field textarea, +.ui.form .fields.info .field select, +.ui.form .fields.info .field input:not([type]), +.ui.form .fields.info .field input[type="date"], +.ui.form .fields.info .field input[type="datetime-local"], +.ui.form .fields.info .field input[type="email"], +.ui.form .fields.info .field input[type="number"], +.ui.form .fields.info .field input[type="password"], +.ui.form .fields.info .field input[type="search"], +.ui.form .fields.info .field input[type="tel"], +.ui.form .fields.info .field input[type="time"], +.ui.form .fields.info .field input[type="text"], +.ui.form .fields.info .field input[type="file"], +.ui.form .fields.info .field input[type="url"], +.ui.form .field.info textarea, +.ui.form .field.info select, +.ui.form .field.info input:not([type]), +.ui.form .field.info input[type="date"], +.ui.form .field.info input[type="datetime-local"], +.ui.form .field.info input[type="email"], +.ui.form .field.info input[type="number"], +.ui.form .field.info input[type="password"], +.ui.form .field.info input[type="search"], +.ui.form .field.info input[type="tel"], +.ui.form .field.info input[type="time"], +.ui.form .field.info input[type="text"], +.ui.form .field.info input[type="file"], +.ui.form .field.info input[type="url"] { + color: #276F86; + background: #F8FFFF; + border-color: #A9D5DE; + border-radius: ''; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.form .field.info textarea:focus, +.ui.form .field.info select:focus, +.ui.form .field.info input:not([type]):focus, +.ui.form .field.info input[type="date"]:focus, +.ui.form .field.info input[type="datetime-local"]:focus, +.ui.form .field.info input[type="email"]:focus, +.ui.form .field.info input[type="number"]:focus, +.ui.form .field.info input[type="password"]:focus, +.ui.form .field.info input[type="search"]:focus, +.ui.form .field.info input[type="tel"]:focus, +.ui.form .field.info input[type="time"]:focus, +.ui.form .field.info input[type="text"]:focus, +.ui.form .field.info input[type="file"]:focus, +.ui.form .field.info input[type="url"]:focus { + background: #F8FFFF; + border-color: #A9D5DE; + color: #276F86; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Preserve Native Select Stylings */ + +.ui.form .field.info select { + -webkit-appearance: menulist-button; +} + +/*------------------ + Input State + --------------------*/ + +/* Transparent */ + +.ui.form .field.info .transparent.input input, +.ui.form .field.info .transparent.input textarea, +.ui.form .field.info input.transparent, +.ui.form .field.info textarea.transparent { + background-color: #F8FFFF !important; + color: #276F86 !important; +} + +/* Autofilled */ + +.ui.form .info.info input:-webkit-autofill { + -webkit-box-shadow: 0 0 0 100px #F0FAFF inset !important; + box-shadow: 0 0 0 100px #F0FAFF inset !important; + border-color: #b3e0e0 !important; +} + +/* Placeholder */ + +.ui.form .info ::-webkit-input-placeholder { + color: #98cfe1; +} + +.ui.form .info :-ms-input-placeholder { + color: #98cfe1 !important; +} + +.ui.form .info ::-moz-placeholder { + color: #98cfe1; +} + +.ui.form .info :focus::-webkit-input-placeholder { + color: #70bdd6; +} + +.ui.form .info :focus:-ms-input-placeholder { + color: #70bdd6 !important; +} + +.ui.form .info :focus::-moz-placeholder { + color: #70bdd6; +} + +/*------------------ + Dropdown State + --------------------*/ + +.ui.form .fields.info .field .ui.dropdown, +.ui.form .fields.info .field .ui.dropdown .item, +.ui.form .field.info .ui.dropdown, +.ui.form .field.info .ui.dropdown > .text, +.ui.form .field.info .ui.dropdown .item { + background: #F8FFFF; + color: #276F86; +} + +.ui.form .fields.info .field .ui.dropdown, +.ui.form .field.info .ui.dropdown { + border-color: #A9D5DE !important; +} + +.ui.form .fields.info .field .ui.dropdown:hover, +.ui.form .field.info .ui.dropdown:hover { + border-color: #A9D5DE !important; +} + +.ui.form .fields.info .field .ui.dropdown:hover .menu, +.ui.form .field.info .ui.dropdown:hover .menu { + border-color: #A9D5DE; +} + +.ui.form .fields.info .field .ui.multiple.selection.dropdown > .label, +.ui.form .field.info .ui.multiple.selection.dropdown > .label { + background-color: #cce3ea; + color: #276F86; +} + +/* Hover */ + +.ui.form .fields.info .field .ui.dropdown .menu .item:hover, +.ui.form .field.info .ui.dropdown .menu .item:hover { + background-color: #e9f2fb; +} + +/* Selected */ + +.ui.form .fields.info .field .ui.dropdown .menu .selected.item, +.ui.form .field.info .ui.dropdown .menu .selected.item { + background-color: #e9f2fb; +} + +/* Active */ + +.ui.form .fields.info .field .ui.dropdown .menu .active.item, +.ui.form .field.info .ui.dropdown .menu .active.item { + background-color: #cef1fd !important; +} + +/*-------------------- + Checkbox State + ---------------------*/ + +.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label, +.ui.form .field.info .checkbox:not(.toggle):not(.slider) label, +.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) .box, +.ui.form .field.info .checkbox:not(.toggle):not(.slider) .box { + color: #276F86; +} + +.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .field.info .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) .box:before, +.ui.form .field.info .checkbox:not(.toggle):not(.slider) .box:before { + background: #F8FFFF; + border-color: #A9D5DE; +} + +.ui.form .fields.info .field .checkbox label:after, +.ui.form .field.info .checkbox label:after, +.ui.form .fields.info .field .checkbox .box:after, +.ui.form .field.info .checkbox .box:after { + color: #276F86; +} + +.ui.inverted.form .fields.info .field label, +.ui.inverted.form .info.field label { + color: #c6e3e9; +} + +/* On Form */ + +.ui.form.success .success.message:not(:empty) { + display: block; +} + +.ui.form.success .compact.success.message:not(:empty) { + display: inline-block; +} + +.ui.form.success .icon.success.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +/* On Field(s) */ + +.ui.form .fields.success .success.message:not(:empty), +.ui.form .field.success .success.message:not(:empty) { + display: block; +} + +.ui.form .fields.success .compact.success.message:not(:empty), +.ui.form .field.success .compact.success.message:not(:empty) { + display: inline-block; +} + +.ui.form .fields.success .icon.success.message:not(:empty), +.ui.form .field.success .icon.success.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +.ui.ui.form .fields.success .field label, +.ui.ui.form .fields.success .field .ui.label:not(.corner), +.ui.ui.form .field.success label, +.ui.ui.form .field.success .ui.label:not(.corner), +.ui.ui.form .fields.success .field .input, +.ui.ui.form .field.success .input { + color: #2C662D; +} + +.ui.form .fields.success .field .ui.label, +.ui.form .field.success .ui.label { + background-color: #b9d1ad; +} + +.ui.form .fields.success .field .corner.label, +.ui.form .field.success .corner.label { + border-color: #2C662D; + color: #FFFFFF; +} + +.ui.form .fields.success .field textarea, +.ui.form .fields.success .field select, +.ui.form .fields.success .field input:not([type]), +.ui.form .fields.success .field input[type="date"], +.ui.form .fields.success .field input[type="datetime-local"], +.ui.form .fields.success .field input[type="email"], +.ui.form .fields.success .field input[type="number"], +.ui.form .fields.success .field input[type="password"], +.ui.form .fields.success .field input[type="search"], +.ui.form .fields.success .field input[type="tel"], +.ui.form .fields.success .field input[type="time"], +.ui.form .fields.success .field input[type="text"], +.ui.form .fields.success .field input[type="file"], +.ui.form .fields.success .field input[type="url"], +.ui.form .field.success textarea, +.ui.form .field.success select, +.ui.form .field.success input:not([type]), +.ui.form .field.success input[type="date"], +.ui.form .field.success input[type="datetime-local"], +.ui.form .field.success input[type="email"], +.ui.form .field.success input[type="number"], +.ui.form .field.success input[type="password"], +.ui.form .field.success input[type="search"], +.ui.form .field.success input[type="tel"], +.ui.form .field.success input[type="time"], +.ui.form .field.success input[type="text"], +.ui.form .field.success input[type="file"], +.ui.form .field.success input[type="url"] { + color: #2C662D; + background: #FCFFF5; + border-color: #A3C293; + border-radius: ''; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.form .field.success textarea:focus, +.ui.form .field.success select:focus, +.ui.form .field.success input:not([type]):focus, +.ui.form .field.success input[type="date"]:focus, +.ui.form .field.success input[type="datetime-local"]:focus, +.ui.form .field.success input[type="email"]:focus, +.ui.form .field.success input[type="number"]:focus, +.ui.form .field.success input[type="password"]:focus, +.ui.form .field.success input[type="search"]:focus, +.ui.form .field.success input[type="tel"]:focus, +.ui.form .field.success input[type="time"]:focus, +.ui.form .field.success input[type="text"]:focus, +.ui.form .field.success input[type="file"]:focus, +.ui.form .field.success input[type="url"]:focus { + background: #FCFFF5; + border-color: #A3C293; + color: #2C662D; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Preserve Native Select Stylings */ + +.ui.form .field.success select { + -webkit-appearance: menulist-button; +} + +/*------------------ + Input State + --------------------*/ + +/* Transparent */ + +.ui.form .field.success .transparent.input input, +.ui.form .field.success .transparent.input textarea, +.ui.form .field.success input.transparent, +.ui.form .field.success textarea.transparent { + background-color: #FCFFF5 !important; + color: #2C662D !important; +} + +/* Autofilled */ + +.ui.form .success.success input:-webkit-autofill { + -webkit-box-shadow: 0 0 0 100px #F0FFF0 inset !important; + box-shadow: 0 0 0 100px #F0FFF0 inset !important; + border-color: #bee0b3 !important; +} + +/* Placeholder */ + +.ui.form .success ::-webkit-input-placeholder { + color: #8fcf90; +} + +.ui.form .success :-ms-input-placeholder { + color: #8fcf90 !important; +} + +.ui.form .success ::-moz-placeholder { + color: #8fcf90; +} + +.ui.form .success :focus::-webkit-input-placeholder { + color: #6cbf6d; +} + +.ui.form .success :focus:-ms-input-placeholder { + color: #6cbf6d !important; +} + +.ui.form .success :focus::-moz-placeholder { + color: #6cbf6d; +} + +/*------------------ + Dropdown State + --------------------*/ + +.ui.form .fields.success .field .ui.dropdown, +.ui.form .fields.success .field .ui.dropdown .item, +.ui.form .field.success .ui.dropdown, +.ui.form .field.success .ui.dropdown > .text, +.ui.form .field.success .ui.dropdown .item { + background: #FCFFF5; + color: #2C662D; +} + +.ui.form .fields.success .field .ui.dropdown, +.ui.form .field.success .ui.dropdown { + border-color: #A3C293 !important; +} + +.ui.form .fields.success .field .ui.dropdown:hover, +.ui.form .field.success .ui.dropdown:hover { + border-color: #A3C293 !important; +} + +.ui.form .fields.success .field .ui.dropdown:hover .menu, +.ui.form .field.success .ui.dropdown:hover .menu { + border-color: #A3C293; +} + +.ui.form .fields.success .field .ui.multiple.selection.dropdown > .label, +.ui.form .field.success .ui.multiple.selection.dropdown > .label { + background-color: #cceacc; + color: #2C662D; +} + +/* Hover */ + +.ui.form .fields.success .field .ui.dropdown .menu .item:hover, +.ui.form .field.success .ui.dropdown .menu .item:hover { + background-color: #e9fbe9; +} + +/* Selected */ + +.ui.form .fields.success .field .ui.dropdown .menu .selected.item, +.ui.form .field.success .ui.dropdown .menu .selected.item { + background-color: #e9fbe9; +} + +/* Active */ + +.ui.form .fields.success .field .ui.dropdown .menu .active.item, +.ui.form .field.success .ui.dropdown .menu .active.item { + background-color: #dafdce !important; +} + +/*-------------------- + Checkbox State + ---------------------*/ + +.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label, +.ui.form .field.success .checkbox:not(.toggle):not(.slider) label, +.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) .box, +.ui.form .field.success .checkbox:not(.toggle):not(.slider) .box { + color: #2C662D; +} + +.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .field.success .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) .box:before, +.ui.form .field.success .checkbox:not(.toggle):not(.slider) .box:before { + background: #FCFFF5; + border-color: #A3C293; +} + +.ui.form .fields.success .field .checkbox label:after, +.ui.form .field.success .checkbox label:after, +.ui.form .fields.success .field .checkbox .box:after, +.ui.form .field.success .checkbox .box:after { + color: #2C662D; +} + +.ui.inverted.form .fields.success .field label, +.ui.inverted.form .success.field label { + color: #b9d1ad; +} + +/* On Form */ + +.ui.form.warning .warning.message:not(:empty) { + display: block; +} + +.ui.form.warning .compact.warning.message:not(:empty) { + display: inline-block; +} + +.ui.form.warning .icon.warning.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +/* On Field(s) */ + +.ui.form .fields.warning .warning.message:not(:empty), +.ui.form .field.warning .warning.message:not(:empty) { + display: block; +} + +.ui.form .fields.warning .compact.warning.message:not(:empty), +.ui.form .field.warning .compact.warning.message:not(:empty) { + display: inline-block; +} + +.ui.form .fields.warning .icon.warning.message:not(:empty), +.ui.form .field.warning .icon.warning.message:not(:empty) { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +.ui.ui.form .fields.warning .field label, +.ui.ui.form .fields.warning .field .ui.label:not(.corner), +.ui.ui.form .field.warning label, +.ui.ui.form .field.warning .ui.label:not(.corner), +.ui.ui.form .fields.warning .field .input, +.ui.ui.form .field.warning .input { + color: #573A08; +} + +.ui.form .fields.warning .field .ui.label, +.ui.form .field.warning .ui.label { + background-color: #d7ccb5; +} + +.ui.form .fields.warning .field .corner.label, +.ui.form .field.warning .corner.label { + border-color: #573A08; + color: #FFFFFF; +} + +.ui.form .fields.warning .field textarea, +.ui.form .fields.warning .field select, +.ui.form .fields.warning .field input:not([type]), +.ui.form .fields.warning .field input[type="date"], +.ui.form .fields.warning .field input[type="datetime-local"], +.ui.form .fields.warning .field input[type="email"], +.ui.form .fields.warning .field input[type="number"], +.ui.form .fields.warning .field input[type="password"], +.ui.form .fields.warning .field input[type="search"], +.ui.form .fields.warning .field input[type="tel"], +.ui.form .fields.warning .field input[type="time"], +.ui.form .fields.warning .field input[type="text"], +.ui.form .fields.warning .field input[type="file"], +.ui.form .fields.warning .field input[type="url"], +.ui.form .field.warning textarea, +.ui.form .field.warning select, +.ui.form .field.warning input:not([type]), +.ui.form .field.warning input[type="date"], +.ui.form .field.warning input[type="datetime-local"], +.ui.form .field.warning input[type="email"], +.ui.form .field.warning input[type="number"], +.ui.form .field.warning input[type="password"], +.ui.form .field.warning input[type="search"], +.ui.form .field.warning input[type="tel"], +.ui.form .field.warning input[type="time"], +.ui.form .field.warning input[type="text"], +.ui.form .field.warning input[type="file"], +.ui.form .field.warning input[type="url"] { + color: #573A08; + background: #FFFAF3; + border-color: #C9BA9B; + border-radius: ''; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.form .field.warning textarea:focus, +.ui.form .field.warning select:focus, +.ui.form .field.warning input:not([type]):focus, +.ui.form .field.warning input[type="date"]:focus, +.ui.form .field.warning input[type="datetime-local"]:focus, +.ui.form .field.warning input[type="email"]:focus, +.ui.form .field.warning input[type="number"]:focus, +.ui.form .field.warning input[type="password"]:focus, +.ui.form .field.warning input[type="search"]:focus, +.ui.form .field.warning input[type="tel"]:focus, +.ui.form .field.warning input[type="time"]:focus, +.ui.form .field.warning input[type="text"]:focus, +.ui.form .field.warning input[type="file"]:focus, +.ui.form .field.warning input[type="url"]:focus { + background: #FFFAF3; + border-color: #C9BA9B; + color: #573A08; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Preserve Native Select Stylings */ + +.ui.form .field.warning select { + -webkit-appearance: menulist-button; +} + +/*------------------ + Input State + --------------------*/ + +/* Transparent */ + +.ui.form .field.warning .transparent.input input, +.ui.form .field.warning .transparent.input textarea, +.ui.form .field.warning input.transparent, +.ui.form .field.warning textarea.transparent { + background-color: #FFFAF3 !important; + color: #573A08 !important; +} + +/* Autofilled */ + +.ui.form .warning.warning input:-webkit-autofill { + -webkit-box-shadow: 0 0 0 100px #FFFFe0 inset !important; + box-shadow: 0 0 0 100px #FFFFe0 inset !important; + border-color: #e0e0b3 !important; +} + +/* Placeholder */ + +.ui.form .warning ::-webkit-input-placeholder { + color: #edad3e; +} + +.ui.form .warning :-ms-input-placeholder { + color: #edad3e !important; +} + +.ui.form .warning ::-moz-placeholder { + color: #edad3e; +} + +.ui.form .warning :focus::-webkit-input-placeholder { + color: #e39715; +} + +.ui.form .warning :focus:-ms-input-placeholder { + color: #e39715 !important; +} + +.ui.form .warning :focus::-moz-placeholder { + color: #e39715; +} + +/*------------------ + Dropdown State + --------------------*/ + +.ui.form .fields.warning .field .ui.dropdown, +.ui.form .fields.warning .field .ui.dropdown .item, +.ui.form .field.warning .ui.dropdown, +.ui.form .field.warning .ui.dropdown > .text, +.ui.form .field.warning .ui.dropdown .item { + background: #FFFAF3; + color: #573A08; +} + +.ui.form .fields.warning .field .ui.dropdown, +.ui.form .field.warning .ui.dropdown { + border-color: #C9BA9B !important; +} + +.ui.form .fields.warning .field .ui.dropdown:hover, +.ui.form .field.warning .ui.dropdown:hover { + border-color: #C9BA9B !important; +} + +.ui.form .fields.warning .field .ui.dropdown:hover .menu, +.ui.form .field.warning .ui.dropdown:hover .menu { + border-color: #C9BA9B; +} + +.ui.form .fields.warning .field .ui.multiple.selection.dropdown > .label, +.ui.form .field.warning .ui.multiple.selection.dropdown > .label { + background-color: #eaeacc; + color: #573A08; +} + +/* Hover */ + +.ui.form .fields.warning .field .ui.dropdown .menu .item:hover, +.ui.form .field.warning .ui.dropdown .menu .item:hover { + background-color: #fbfbe9; +} + +/* Selected */ + +.ui.form .fields.warning .field .ui.dropdown .menu .selected.item, +.ui.form .field.warning .ui.dropdown .menu .selected.item { + background-color: #fbfbe9; +} + +/* Active */ + +.ui.form .fields.warning .field .ui.dropdown .menu .active.item, +.ui.form .field.warning .ui.dropdown .menu .active.item { + background-color: #fdfdce !important; +} + +/*-------------------- + Checkbox State + ---------------------*/ + +.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label, +.ui.form .field.warning .checkbox:not(.toggle):not(.slider) label, +.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) .box, +.ui.form .field.warning .checkbox:not(.toggle):not(.slider) .box { + color: #573A08; +} + +.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .field.warning .checkbox:not(.toggle):not(.slider) label:before, +.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) .box:before, +.ui.form .field.warning .checkbox:not(.toggle):not(.slider) .box:before { + background: #FFFAF3; + border-color: #C9BA9B; +} + +.ui.form .fields.warning .field .checkbox label:after, +.ui.form .field.warning .checkbox label:after, +.ui.form .fields.warning .field .checkbox .box:after, +.ui.form .field.warning .checkbox .box:after { + color: #573A08; +} + +.ui.inverted.form .fields.warning .field label, +.ui.inverted.form .warning.field label { + color: #d7ccb5; +} + +/*-------------------- + Disabled + ---------------------*/ + +.ui.form .disabled.fields .field, +.ui.form .disabled.field, +.ui.form .field :disabled { + pointer-events: none; + opacity: 0.45; +} + +.ui.form .field.disabled > label, +.ui.form .fields.disabled > label { + opacity: 0.45; +} + +.ui.form .field.disabled :disabled { + opacity: 1; +} + +/*-------------- + Loading + ---------------*/ + +.ui.loading.form { + position: relative; + cursor: default; + pointer-events: none; +} + +.ui.loading.form:before { + position: absolute; + content: ''; + top: 0; + left: 0; + background: rgba(255, 255, 255, 0.8); + width: 100%; + height: 100%; + z-index: 100; +} + +.ui.loading.form.segments:before { + border-radius: 0.33333333rem; +} + +.ui.loading.form:after { + position: absolute; + content: ''; + top: 50%; + left: 50%; + margin: -1.5em 0 0 -1.5em; + width: 3em; + height: 3em; + -webkit-animation: loader 0.6s infinite linear; + animation: loader 0.6s infinite linear; + border: 0.2em solid #767676; + border-radius: 500rem; + -webkit-box-shadow: 0 0 0 1px transparent; + box-shadow: 0 0 0 1px transparent; + visibility: visible; + z-index: 101; +} + +/******************************* + Element Types +*******************************/ + +/*-------------------- + Required Field + ---------------------*/ + +.ui.form .required.fields:not(.grouped) > .field > label:after, +.ui.form .required.fields.grouped > label:after, +.ui.form .required.field > label:after, +.ui.form .required.fields:not(.grouped) > .field > .checkbox:after, +.ui.form .required.field > .checkbox:after, +.ui.form label.required:after { + margin: -0.2em 0 0 0.2em; + content: '*'; + color: #DB2828; +} + +.ui.form .required.fields:not(.grouped) > .field > label:after, +.ui.form .required.fields.grouped > label:after, +.ui.form .required.field > label:after, +.ui.form label.required:after { + display: inline-block; + vertical-align: top; +} + +.ui.form .required.fields:not(.grouped) > .field > .checkbox:after, +.ui.form .required.field > .checkbox:after { + position: absolute; + top: 0; + left: 100%; +} + +/******************************* + Variations +*******************************/ + +/*-------------------- + Inverted Colors + ---------------------*/ + +.ui.inverted.form label, +.ui.form .inverted.segment label, +.ui.form .inverted.segment .ui.checkbox label, +.ui.form .inverted.segment .ui.checkbox .box, +.ui.inverted.form .ui.checkbox label, +.ui.inverted.form .ui.checkbox .box, +.ui.inverted.form .inline.fields > label, +.ui.inverted.form .inline.fields .field > label, +.ui.inverted.form .inline.fields .field > p, +.ui.inverted.form .inline.field > label, +.ui.inverted.form .inline.field > p { + color: rgba(255, 255, 255, 0.9); +} + +.ui.inverted.loading.form { + color: #FFFFFF; +} + +.ui.inverted.loading.form:before { + background: rgba(0, 0, 0, 0.85); +} + +/* Inverted Field */ + +.ui.inverted.form input:not([type]), +.ui.inverted.form input[type="date"], +.ui.inverted.form input[type="datetime-local"], +.ui.inverted.form input[type="email"], +.ui.inverted.form input[type="number"], +.ui.inverted.form input[type="password"], +.ui.inverted.form input[type="search"], +.ui.inverted.form input[type="tel"], +.ui.inverted.form input[type="time"], +.ui.inverted.form input[type="text"], +.ui.inverted.form input[type="file"], +.ui.inverted.form input[type="url"] { + background: #FFFFFF; + border-color: rgba(255, 255, 255, 0.1); + color: rgba(0, 0, 0, 0.87); + -webkit-box-shadow: none; + box-shadow: none; +} + +/*-------------------- + Field Groups + ---------------------*/ + +/* Grouped Vertically */ + +.ui.form .grouped.fields { + display: block; + margin: 0 0 1em; +} + +.ui.form .grouped.fields:last-child { + margin-bottom: 0; +} + +.ui.form .grouped.fields > label { + margin: 0 0 0.33333333rem 0; + color: rgba(0, 0, 0, 0.87); + font-size: 0.91666667em; + font-weight: bold; + text-transform: none; +} + +.ui.form .grouped.fields .field, +.ui.form .grouped.inline.fields .field { + display: block; + margin: 0.5em 0; + padding: 0; +} + +.ui.form .grouped.inline.fields .ui.checkbox { + margin-bottom: 0.4em; +} + +/*-------------------- + Fields +---------------------*/ + +/* Split fields */ + +.ui.form .fields { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + margin: 0 -0.5em 1em; +} + +.ui.form .fields > .field { + -webkit-box-flex: 0; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + padding-left: 0.5em; + padding-right: 0.5em; +} + +.ui.form .fields > .field:first-child { + border-left: none; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Other Combinations */ + +.ui.form .two.fields > .fields, +.ui.form .two.fields > .field { + width: 50%; +} + +.ui.form .three.fields > .fields, +.ui.form .three.fields > .field { + width: 33.33333333%; +} + +.ui.form .four.fields > .fields, +.ui.form .four.fields > .field { + width: 25%; +} + +.ui.form .five.fields > .fields, +.ui.form .five.fields > .field { + width: 20%; +} + +.ui.form .six.fields > .fields, +.ui.form .six.fields > .field { + width: 16.66666667%; +} + +.ui.form .seven.fields > .fields, +.ui.form .seven.fields > .field { + width: 14.28571429%; +} + +.ui.form .eight.fields > .fields, +.ui.form .eight.fields > .field { + width: 12.5%; +} + +.ui.form .nine.fields > .fields, +.ui.form .nine.fields > .field { + width: 11.11111111%; +} + +.ui.form .ten.fields > .fields, +.ui.form .ten.fields > .field { + width: 10%; +} + +/* Swap to full width on mobile */ + +@media only screen and (max-width: 767.98px) { + .ui.form .fields { + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-bottom: 0; + } + + .ui.form:not(.unstackable) .fields:not(.unstackable) > .fields, + .ui.form:not(.unstackable) .fields:not(.unstackable) > .field { + width: 100%; + margin: 0 0 1em; + } +} + +/* Sizing Combinations */ + +.ui.form .fields .wide.field { + width: 6.25%; + padding-left: 0.5em; + padding-right: 0.5em; +} + +.ui.form .one.wide.field { + width: 6.25%; +} + +.ui.form .two.wide.field { + width: 12.5%; +} + +.ui.form .three.wide.field { + width: 18.75%; +} + +.ui.form .four.wide.field { + width: 25%; +} + +.ui.form .five.wide.field { + width: 31.25%; +} + +.ui.form .six.wide.field { + width: 37.5%; +} + +.ui.form .seven.wide.field { + width: 43.75%; +} + +.ui.form .eight.wide.field { + width: 50%; +} + +.ui.form .nine.wide.field { + width: 56.25%; +} + +.ui.form .ten.wide.field { + width: 62.5%; +} + +.ui.form .eleven.wide.field { + width: 68.75%; +} + +.ui.form .twelve.wide.field { + width: 75%; +} + +.ui.form .thirteen.wide.field { + width: 81.25%; +} + +.ui.form .fourteen.wide.field { + width: 87.5%; +} + +.ui.form .fifteen.wide.field { + width: 93.75%; +} + +.ui.form .sixteen.wide.field { + width: 100%; +} + +/*-------------------- + Equal Width +---------------------*/ + +.ui[class*="equal width"].form .fields > .field, +.ui.form [class*="equal width"].fields > .field { + width: 100%; + -webkit-box-flex: 1; + -ms-flex: 1 1 auto; + flex: 1 1 auto; +} + +/*-------------------- + Inline Fields + ---------------------*/ + +.ui.form .inline.fields { + margin: 0 0 1em; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; +} + +.ui.form .inline.fields .field { + margin: 0; + padding: 0 1em 0 0; +} + +/* Inline Label */ + +.ui.form .inline.fields > label, +.ui.form .inline.fields .field > label, +.ui.form .inline.fields .field > p, +.ui.form .inline.field > label, +.ui.form .inline.field > p { + display: inline-block; + width: auto; + margin-top: 0; + margin-bottom: 0; + vertical-align: baseline; + font-size: 0.91666667em; + font-weight: bold; + color: rgba(0, 0, 0, 0.87); + text-transform: none; +} + +/* Grouped Inline Label */ + +.ui.form .inline.fields > label { + margin: 0.035714em 1em 0 0; +} + +/* Inline Input */ + +.ui.form .inline.fields .field > input, +.ui.form .inline.fields .field > select, +.ui.form .inline.field > input, +.ui.form .inline.field > select { + display: inline-block; + width: auto; + margin-top: 0; + margin-bottom: 0; + vertical-align: middle; + font-size: 1em; +} + +.ui.form .inline.fields .field .calendar:not(.popup), +.ui.form .inline.field .calendar:not(.popup) { + display: inline-block; +} + +.ui.form .inline.fields .field .calendar:not(.popup) > .input > input, +.ui.form .inline.field .calendar:not(.popup) > .input > input { + width: 13.11em; +} + +/* Label */ + +.ui.form .inline.fields .field > :first-child, +.ui.form .inline.field > :first-child { + margin: 0 0.83333333em 0 0; +} + +.ui.form .inline.fields .field > :only-child, +.ui.form .inline.field > :only-child { + margin: 0; +} + +/* Wide */ + +.ui.form .inline.fields .wide.field { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; +} + +.ui.form .inline.fields .wide.field > input, +.ui.form .inline.fields .wide.field > select { + width: 100%; +} + +/*-------------------- + Sizes +---------------------*/ + +.ui.form, +.ui.form .field .dropdown, +.ui.form .field .dropdown .menu > .item { + font-size: 1rem; +} + +.ui.mini.form, +.ui.mini.form .field .dropdown, +.ui.mini.form .field .dropdown .menu > .item { + font-size: 0.75rem; +} + +.ui.tiny.form, +.ui.tiny.form .field .dropdown, +.ui.tiny.form .field .dropdown .menu > .item { + font-size: 0.83333333rem; +} + +.ui.small.form, +.ui.small.form .field .dropdown, +.ui.small.form .field .dropdown .menu > .item { + font-size: 0.91666667rem; +} + +.ui.large.form, +.ui.large.form .field .dropdown, +.ui.large.form .field .dropdown .menu > .item { + font-size: 1.16666667rem; +} + +.ui.big.form, +.ui.big.form .field .dropdown, +.ui.big.form .field .dropdown .menu > .item { + font-size: 1.25rem; +} + +.ui.huge.form, +.ui.huge.form .field .dropdown, +.ui.huge.form .field .dropdown .menu > .item { + font-size: 1.41666667rem; +} + +.ui.massive.form, +.ui.massive.form .field .dropdown, +.ui.massive.form .field .dropdown .menu > .item { + font-size: 1.75rem; +} + +/******************************* + Theme Overrides +*******************************/ + +/******************************* + Site Overrides +*******************************/ /*! * # Fomantic-UI 2.8.8 - Header * http://github.com/fomantic/Fomantic-UI/ @@ -26528,961 +28723,6 @@ a.ui.ui.ui.inverted.basic.black.label:hover { Theme Overrides *******************************/ -/******************************* - Site Overrides -*******************************/ -/*! - * # Fomantic-UI 2.8.8 - Loader - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Loader -*******************************/ - -/* Standard Size */ - -.ui.loader { - display: none; - position: absolute; - top: 50%; - left: 50%; - margin: 0; - text-align: center; - z-index: 1000; - -webkit-transform: translateX(-50%) translateY(-50%); - transform: translateX(-50%) translateY(-50%); -} - -/* Static Shape */ - -.ui.loader:before { - position: absolute; - content: ''; - top: 0; - left: 50%; - width: 100%; - height: 100%; - border-radius: 500rem; - border: 0.2em solid rgba(0, 0, 0, 0.1); -} - -/* Active Shape */ - -.ui.loader:after { - position: absolute; - content: ''; - top: 0; - left: 50%; - width: 100%; - height: 100%; - -webkit-animation: loader 0.6s infinite linear; - animation: loader 0.6s infinite linear; - border: 0.2em solid #767676; - border-radius: 500rem; - -webkit-box-shadow: 0 0 0 1px transparent; - box-shadow: 0 0 0 1px transparent; -} - -/* Speeds */ - -.ui.fast.loading.loading:after, -.ui.fast.loading.loading .input > i.icon:after, -.ui.fast.loading.loading > i.icon:after, -.ui.fast.loader:after { - -webkit-animation-duration: 0.3s; - animation-duration: 0.3s; -} - -.ui.slow.loading.loading:after, -.ui.slow.loading.loading .input > i.icon:after, -.ui.slow.loading.loading > i.icon:after, -.ui.slow.loader:after { - -webkit-animation-duration: 0.9s; - animation-duration: 0.9s; -} - -/* Active Animation */ - -@-webkit-keyframes loader { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -/*------------------- - Coupling ---------------------*/ - -/* Show inside active dimmer */ - -.ui.dimmer > .loader { - display: block; -} - -/* Black Dimmer */ - -.ui.dimmer > .ui.loader { - color: rgba(255, 255, 255, 0.9); -} - -.ui.dimmer > .ui.loader:not(.elastic):before { - border-color: rgba(255, 255, 255, 0.15); -} - -/* White Dimmer (Inverted) */ - -.ui.inverted.dimmer > .ui.loader { - color: rgba(0, 0, 0, 0.87); -} - -.ui.inverted.dimmer > .ui.loader:not(.elastic):before { - border-color: rgba(0, 0, 0, 0.1); -} - -/******************************* - Types -*******************************/ - -/*------------------- - Text - --------------------*/ - -.ui.ui.ui.ui.text.loader { - width: auto; - height: auto; - text-align: center; - font-style: normal; -} - -/******************************* - States -*******************************/ - -.ui.indeterminate.loader:after { - animation-direction: reverse; - -webkit-animation-duration: 1.2s; - animation-duration: 1.2s; -} - -.ui.loader.active, -.ui.loader.visible { - display: block; -} - -.ui.loader.disabled, -.ui.loader.hidden { - display: none; -} - -/******************************* - Variations -*******************************/ - -/*------------------- - Sizes ---------------------*/ - -.ui.loader { - width: 2.66666667rem; - height: 2.66666667rem; - font-size: 1em; -} - -.ui.loader:before, -.ui.loader:after { - width: 2.66666667rem; - height: 2.66666667rem; - margin: 0 0 0 -1.33333333rem; -} - -.ui.text.loader { - min-width: 2.66666667rem; - padding-top: 3.41666667rem; -} - -.ui.mini.loader { - width: 1.16666667rem; - height: 1.16666667rem; - font-size: 0.75em; -} - -.ui.mini.loader:before, -.ui.mini.loader:after { - width: 1.16666667rem; - height: 1.16666667rem; - margin: 0 0 0 -0.58333333rem; -} - -.ui.mini.text.loader { - min-width: 1.16666667rem; - padding-top: 1.91666667rem; -} - -.ui.tiny.loader { - width: 1.33333333rem; - height: 1.33333333rem; - font-size: 0.83333333em; -} - -.ui.tiny.loader:before, -.ui.tiny.loader:after { - width: 1.33333333rem; - height: 1.33333333rem; - margin: 0 0 0 -0.66666667rem; -} - -.ui.tiny.text.loader { - min-width: 1.33333333rem; - padding-top: 2.08333333rem; -} - -.ui.small.loader { - width: 2rem; - height: 2rem; - font-size: 0.91666667em; -} - -.ui.small.loader:before, -.ui.small.loader:after { - width: 2rem; - height: 2rem; - margin: 0 0 0 -1rem; -} - -.ui.small.text.loader { - min-width: 2rem; - padding-top: 2.75rem; -} - -.ui.large.loader { - width: 4rem; - height: 4rem; - font-size: 1.16666667em; -} - -.ui.large.loader:before, -.ui.large.loader:after { - width: 4rem; - height: 4rem; - margin: 0 0 0 -2rem; -} - -.ui.large.text.loader { - min-width: 4rem; - padding-top: 4.75rem; -} - -.ui.big.loader { - width: 4.33333333rem; - height: 4.33333333rem; - font-size: 1.25em; -} - -.ui.big.loader:before, -.ui.big.loader:after { - width: 4.33333333rem; - height: 4.33333333rem; - margin: 0 0 0 -2.16666667rem; -} - -.ui.big.text.loader { - min-width: 4.33333333rem; - padding-top: 5.08333333rem; -} - -.ui.huge.loader { - width: 4.83333333rem; - height: 4.83333333rem; - font-size: 1.41666667em; -} - -.ui.huge.loader:before, -.ui.huge.loader:after { - width: 4.83333333rem; - height: 4.83333333rem; - margin: 0 0 0 -2.41666667rem; -} - -.ui.huge.text.loader { - min-width: 4.83333333rem; - padding-top: 5.58333333rem; -} - -.ui.massive.loader { - width: 5.33333333rem; - height: 5.33333333rem; - font-size: 1.75em; -} - -.ui.massive.loader:before, -.ui.massive.loader:after { - width: 5.33333333rem; - height: 5.33333333rem; - margin: 0 0 0 -2.66666667rem; -} - -.ui.massive.text.loader { - min-width: 5.33333333rem; - padding-top: 6.08333333rem; -} - -/*------------------- - Colors ---------------------*/ - -.ui.primary.elastic.loader.loader:before, -.ui.primary.basic.elastic.loading.button:before, -.ui.primary.basic.elastic.loading.button:after, -.ui.primary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.primary.elastic.loading.loading.loading .input > i.icon:before, -.ui.primary.elastic.loading.loading.loading.loading > i.icon:before, -.ui.primary.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.primary.loading.loading.loading.loading .input > i.icon:after, -.ui.primary.loading.loading.loading.loading > i.icon:after, -.ui.primary.loader.loader.loader:after { - color: #6435C9; -} - -.ui.inverted.primary.elastic.loader:before, -.ui.inverted.primary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.primary.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.primary.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.primary.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.primary.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.primary.loading.loading.loading.loading > i.icon:after, -.ui.inverted.primary.loader.loader.loader:after { - color: #54C8FF; -} - -.ui.secondary.elastic.loader.loader:before, -.ui.secondary.basic.elastic.loading.button:before, -.ui.secondary.basic.elastic.loading.button:after, -.ui.secondary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.secondary.elastic.loading.loading.loading .input > i.icon:before, -.ui.secondary.elastic.loading.loading.loading.loading > i.icon:before, -.ui.secondary.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.secondary.loading.loading.loading.loading .input > i.icon:after, -.ui.secondary.loading.loading.loading.loading > i.icon:after, -.ui.secondary.loader.loader.loader:after { - color: #1B1C1D; -} - -.ui.inverted.secondary.elastic.loader:before, -.ui.inverted.secondary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.secondary.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.secondary.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.secondary.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.secondary.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.secondary.loading.loading.loading.loading > i.icon:after, -.ui.inverted.secondary.loader.loader.loader:after { - color: #545454; -} - -.ui.red.elastic.loader.loader:before, -.ui.red.basic.elastic.loading.button:before, -.ui.red.basic.elastic.loading.button:after, -.ui.red.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.red.elastic.loading.loading.loading .input > i.icon:before, -.ui.red.elastic.loading.loading.loading.loading > i.icon:before, -.ui.red.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.red.loading.loading.loading.loading .input > i.icon:after, -.ui.red.loading.loading.loading.loading > i.icon:after, -.ui.red.loader.loader.loader:after { - color: #DB2828; -} - -.ui.inverted.red.elastic.loader:before, -.ui.inverted.red.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.red.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.red.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.red.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.red.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.red.loading.loading.loading.loading > i.icon:after, -.ui.inverted.red.loader.loader.loader:after { - color: #FF695E; -} - -.ui.orange.elastic.loader.loader:before, -.ui.orange.basic.elastic.loading.button:before, -.ui.orange.basic.elastic.loading.button:after, -.ui.orange.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.orange.elastic.loading.loading.loading .input > i.icon:before, -.ui.orange.elastic.loading.loading.loading.loading > i.icon:before, -.ui.orange.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.orange.loading.loading.loading.loading .input > i.icon:after, -.ui.orange.loading.loading.loading.loading > i.icon:after, -.ui.orange.loader.loader.loader:after { - color: #F2711C; -} - -.ui.inverted.orange.elastic.loader:before, -.ui.inverted.orange.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.orange.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.orange.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.orange.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.orange.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.orange.loading.loading.loading.loading > i.icon:after, -.ui.inverted.orange.loader.loader.loader:after { - color: #FF851B; -} - -.ui.yellow.elastic.loader.loader:before, -.ui.yellow.basic.elastic.loading.button:before, -.ui.yellow.basic.elastic.loading.button:after, -.ui.yellow.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.yellow.elastic.loading.loading.loading .input > i.icon:before, -.ui.yellow.elastic.loading.loading.loading.loading > i.icon:before, -.ui.yellow.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.yellow.loading.loading.loading.loading .input > i.icon:after, -.ui.yellow.loading.loading.loading.loading > i.icon:after, -.ui.yellow.loader.loader.loader:after { - color: #FBBD08; -} - -.ui.inverted.yellow.elastic.loader:before, -.ui.inverted.yellow.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.yellow.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.yellow.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.yellow.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.yellow.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.yellow.loading.loading.loading.loading > i.icon:after, -.ui.inverted.yellow.loader.loader.loader:after { - color: #FFE21F; -} - -.ui.olive.elastic.loader.loader:before, -.ui.olive.basic.elastic.loading.button:before, -.ui.olive.basic.elastic.loading.button:after, -.ui.olive.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.olive.elastic.loading.loading.loading .input > i.icon:before, -.ui.olive.elastic.loading.loading.loading.loading > i.icon:before, -.ui.olive.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.olive.loading.loading.loading.loading .input > i.icon:after, -.ui.olive.loading.loading.loading.loading > i.icon:after, -.ui.olive.loader.loader.loader:after { - color: #B5CC18; -} - -.ui.inverted.olive.elastic.loader:before, -.ui.inverted.olive.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.olive.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.olive.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.olive.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.olive.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.olive.loading.loading.loading.loading > i.icon:after, -.ui.inverted.olive.loader.loader.loader:after { - color: #D9E778; -} - -.ui.green.elastic.loader.loader:before, -.ui.green.basic.elastic.loading.button:before, -.ui.green.basic.elastic.loading.button:after, -.ui.green.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.green.elastic.loading.loading.loading .input > i.icon:before, -.ui.green.elastic.loading.loading.loading.loading > i.icon:before, -.ui.green.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.green.loading.loading.loading.loading .input > i.icon:after, -.ui.green.loading.loading.loading.loading > i.icon:after, -.ui.green.loader.loader.loader:after { - color: #21BA45; -} - -.ui.inverted.green.elastic.loader:before, -.ui.inverted.green.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.green.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.green.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.green.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.green.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.green.loading.loading.loading.loading > i.icon:after, -.ui.inverted.green.loader.loader.loader:after { - color: #2ECC40; -} - -.ui.teal.elastic.loader.loader:before, -.ui.teal.basic.elastic.loading.button:before, -.ui.teal.basic.elastic.loading.button:after, -.ui.teal.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.teal.elastic.loading.loading.loading .input > i.icon:before, -.ui.teal.elastic.loading.loading.loading.loading > i.icon:before, -.ui.teal.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.teal.loading.loading.loading.loading .input > i.icon:after, -.ui.teal.loading.loading.loading.loading > i.icon:after, -.ui.teal.loader.loader.loader:after { - color: #00B5AD; -} - -.ui.inverted.teal.elastic.loader:before, -.ui.inverted.teal.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.teal.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.teal.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.teal.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.teal.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.teal.loading.loading.loading.loading > i.icon:after, -.ui.inverted.teal.loader.loader.loader:after { - color: #6DFFFF; -} - -.ui.blue.elastic.loader.loader:before, -.ui.blue.basic.elastic.loading.button:before, -.ui.blue.basic.elastic.loading.button:after, -.ui.blue.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.blue.elastic.loading.loading.loading .input > i.icon:before, -.ui.blue.elastic.loading.loading.loading.loading > i.icon:before, -.ui.blue.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.blue.loading.loading.loading.loading .input > i.icon:after, -.ui.blue.loading.loading.loading.loading > i.icon:after, -.ui.blue.loader.loader.loader:after { - color: #2185D0; -} - -.ui.inverted.blue.elastic.loader:before, -.ui.inverted.blue.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.blue.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.blue.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.blue.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.blue.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.blue.loading.loading.loading.loading > i.icon:after, -.ui.inverted.blue.loader.loader.loader:after { - color: #54C8FF; -} - -.ui.violet.elastic.loader.loader:before, -.ui.violet.basic.elastic.loading.button:before, -.ui.violet.basic.elastic.loading.button:after, -.ui.violet.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.violet.elastic.loading.loading.loading .input > i.icon:before, -.ui.violet.elastic.loading.loading.loading.loading > i.icon:before, -.ui.violet.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.violet.loading.loading.loading.loading .input > i.icon:after, -.ui.violet.loading.loading.loading.loading > i.icon:after, -.ui.violet.loader.loader.loader:after { - color: #6435C9; -} - -.ui.inverted.violet.elastic.loader:before, -.ui.inverted.violet.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.violet.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.violet.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.violet.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.violet.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.violet.loading.loading.loading.loading > i.icon:after, -.ui.inverted.violet.loader.loader.loader:after { - color: #A291FB; -} - -.ui.purple.elastic.loader.loader:before, -.ui.purple.basic.elastic.loading.button:before, -.ui.purple.basic.elastic.loading.button:after, -.ui.purple.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.purple.elastic.loading.loading.loading .input > i.icon:before, -.ui.purple.elastic.loading.loading.loading.loading > i.icon:before, -.ui.purple.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.purple.loading.loading.loading.loading .input > i.icon:after, -.ui.purple.loading.loading.loading.loading > i.icon:after, -.ui.purple.loader.loader.loader:after { - color: #A333C8; -} - -.ui.inverted.purple.elastic.loader:before, -.ui.inverted.purple.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.purple.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.purple.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.purple.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.purple.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.purple.loading.loading.loading.loading > i.icon:after, -.ui.inverted.purple.loader.loader.loader:after { - color: #DC73FF; -} - -.ui.pink.elastic.loader.loader:before, -.ui.pink.basic.elastic.loading.button:before, -.ui.pink.basic.elastic.loading.button:after, -.ui.pink.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.pink.elastic.loading.loading.loading .input > i.icon:before, -.ui.pink.elastic.loading.loading.loading.loading > i.icon:before, -.ui.pink.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.pink.loading.loading.loading.loading .input > i.icon:after, -.ui.pink.loading.loading.loading.loading > i.icon:after, -.ui.pink.loader.loader.loader:after { - color: #E03997; -} - -.ui.inverted.pink.elastic.loader:before, -.ui.inverted.pink.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.pink.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.pink.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.pink.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.pink.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.pink.loading.loading.loading.loading > i.icon:after, -.ui.inverted.pink.loader.loader.loader:after { - color: #FF8EDF; -} - -.ui.brown.elastic.loader.loader:before, -.ui.brown.basic.elastic.loading.button:before, -.ui.brown.basic.elastic.loading.button:after, -.ui.brown.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.brown.elastic.loading.loading.loading .input > i.icon:before, -.ui.brown.elastic.loading.loading.loading.loading > i.icon:before, -.ui.brown.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.brown.loading.loading.loading.loading .input > i.icon:after, -.ui.brown.loading.loading.loading.loading > i.icon:after, -.ui.brown.loader.loader.loader:after { - color: #A5673F; -} - -.ui.inverted.brown.elastic.loader:before, -.ui.inverted.brown.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.brown.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.brown.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.brown.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.brown.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.brown.loading.loading.loading.loading > i.icon:after, -.ui.inverted.brown.loader.loader.loader:after { - color: #D67C1C; -} - -.ui.grey.elastic.loader.loader:before, -.ui.grey.basic.elastic.loading.button:before, -.ui.grey.basic.elastic.loading.button:after, -.ui.grey.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.grey.elastic.loading.loading.loading .input > i.icon:before, -.ui.grey.elastic.loading.loading.loading.loading > i.icon:before, -.ui.grey.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.grey.loading.loading.loading.loading .input > i.icon:after, -.ui.grey.loading.loading.loading.loading > i.icon:after, -.ui.grey.loader.loader.loader:after { - color: #767676; -} - -.ui.inverted.grey.elastic.loader:before, -.ui.inverted.grey.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.grey.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.grey.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.grey.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.grey.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.grey.loading.loading.loading.loading > i.icon:after, -.ui.inverted.grey.loader.loader.loader:after { - color: #DCDDDE; -} - -.ui.black.elastic.loader.loader:before, -.ui.black.basic.elastic.loading.button:before, -.ui.black.basic.elastic.loading.button:after, -.ui.black.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.black.elastic.loading.loading.loading .input > i.icon:before, -.ui.black.elastic.loading.loading.loading.loading > i.icon:before, -.ui.black.loading.loading.loading.loading:not(.usual):not(.button):after, -.ui.black.loading.loading.loading.loading .input > i.icon:after, -.ui.black.loading.loading.loading.loading > i.icon:after, -.ui.black.loader.loader.loader:after { - color: #1B1C1D; -} - -.ui.inverted.black.elastic.loader:before, -.ui.inverted.black.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, -.ui.inverted.black.elastic.loading.loading.loading .input > i.icon:before, -.ui.inverted.black.elastic.loading.loading.loading > i.icon:before, -.ui.inverted.black.loading.loading.loading.loading:not(.usual):after, -.ui.inverted.black.loading.loading.loading.loading .input > i.icon:after, -.ui.inverted.black.loading.loading.loading.loading > i.icon:after, -.ui.inverted.black.loader.loader.loader:after { - color: #545454; -} - -.ui.elastic.loader.loader:before, -.ui.elastic.loading.loading.loading:before, -.ui.elastic.loading.loading.loading .input > i.icon:before, -.ui.elastic.loading.loading.loading > i.icon:before, -.ui.loading.loading.loading.loading:not(.usual):after, -.ui.loading.loading.loading.loading .input > i.icon:after, -.ui.loading.loading.loading.loading > i.icon:after, -.ui.loader.loader.loader:after { - border-color: currentColor; -} - -.ui.elastic.loading.loading.loading.loading.button:not(.inverted):not(.basic):before { - color: #FFFFFF; -} - -.ui.elastic.basic.loading.button:before, -.ui.elastic.basic.loading.button:after { - color: #767676; -} - -.ui.double.loading.loading.loading.loading.button:after { - border-bottom-color: currentColor; -} - -/*------------------- - Inline - --------------------*/ - -.ui.inline.loader { - position: relative; - vertical-align: middle; - margin: 0; - left: 0; - top: 0; - -webkit-transform: none; - transform: none; -} - -.ui.inline.loader.active, -.ui.inline.loader.visible { - display: inline-block; -} - -/* Centered Inline */ - -.ui.centered.inline.loader.active, -.ui.centered.inline.loader.visible { - display: block; - margin-left: auto; - margin-right: auto; -} - -.ui.loading.loading.loading.loading.loading.loading:after, -.ui.loading.loading.loading.loading.loading.loading .input > i.icon:after, -.ui.loading.loading.loading.loading.loading.loading > i.icon:after, -.ui.loader.loader.loader.loader.loader:after { - border-left-color: transparent; - border-right-color: transparent; -} - -.ui.loading.loading.loading.loading.loading.loading.loading:not(.double):after, -.ui.loading.loading.loading.loading.loading.loading.loading:not(.double) .input > i.icon:after, -.ui.loading.loading.loading.loading.loading.loading.loading:not(.double) > i.icon:after, -.ui.loader.loader.loader.loader.loader.loader:not(.double):after { - border-bottom-color: transparent; -} - -.ui.loading.loading.loading.loading.loading.loading.card:after, -.ui.loading.loading.loading.loading.loading.loading.segments:after, -.ui.loading.loading.loading.loading.loading.loading.segment:after, -.ui.loading.loading.loading.loading.loading.loading.form:after { - border-left-color: rgba(0, 0, 0, 0.1); - border-right-color: rgba(0, 0, 0, 0.1); -} - -.ui.loading.loading.loading.loading.loading.loading.card:not(.double):after, -.ui.loading.loading.loading.loading.loading.loading.segments:not(.double):after, -.ui.loading.loading.loading.loading.loading.loading.segment:not(.double):after, -.ui.loading.loading.loading.loading.loading.loading.form:not(.double):after { - border-bottom-color: rgba(0, 0, 0, 0.1); -} - -/*------------------- - Elastic - --------------------*/ - -.ui.dimmer > .ui.elastic.loader { - color: #FFFFFF; -} - -.ui.inverted.dimmer > .ui.elastic.loader { - color: #767676; -} - -.ui.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after, -.ui.elastic.loading.loading .input > i.icon:after, -.ui.elastic.loading.loading > i.icon:after, -.ui.elastic.loader.loader:after { - -webkit-animation: loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); - animation: loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); - -webkit-animation-delay: 0.3s; - animation-delay: 0.3s; -} - -.ui.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before, -.ui.elastic.loading.loading.loading .input > i.icon:before, -.ui.elastic.loading.loading.loading > i.icon:before, -.ui.elastic.loader.loader:before { - -webkit-animation: elastic-loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); - animation: elastic-loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); - -moz-animation: currentcolor-elastic-loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); - border-right-color: transparent; -} - -.ui.elastic.inline.loader:empty { - -webkit-animation: loader 8s infinite linear; - animation: loader 8s infinite linear; -} - -.ui.slow.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after, -.ui.slow.elastic.loading.loading .input > i.icon:after, -.ui.slow.elastic.loading.loading > i.icon:after, -.ui.slow.elastic.loader.loader:after { - -webkit-animation-duration: 1.5s; - animation-duration: 1.5s; - -webkit-animation-delay: 0.45s; - animation-delay: 0.45s; -} - -.ui.slow.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before, -.ui.slow.elastic.loading.loading.loading .input > i.icon:before, -.ui.slow.elastic.loading.loading.loading > i.icon:before, -.ui.slow.elastic.loader.loader:before { - -webkit-animation-duration: 1.5s; - animation-duration: 1.5s; -} - -.ui.fast.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after, -.ui.fast.elastic.loading.loading .input > i.icon:after, -.ui.fast.elastic.loading.loading > i.icon:after, -.ui.fast.elastic.loader.loader:after { - -webkit-animation-duration: 0.66s; - animation-duration: 0.66s; - -webkit-animation-delay: 0.2s; - animation-delay: 0.2s; -} - -.ui.fast.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before, -.ui.fast.elastic.loading.loading.loading .input > i.icon:before, -.ui.fast.elastic.loading.loading.loading > i.icon:before, -.ui.fast.elastic.loader.loader:before { - -webkit-animation-duration: 0.66s; - animation-duration: 0.66s; -} - -@-webkit-keyframes elastic-loader { - 0%, 1% { - border-left-color: transparent; - border-bottom-color: transparent; - } - - 1.1%, 50% { - border-left-color: inherit; - } - - 10%, 35.1% { - border-bottom-color: transparent; - } - - 10.1%, 35% { - border-bottom-color: inherit; - } - - 50.1% { - border-left-color: transparent; - } - - 100% { - border-left-color: transparent; - border-bottom-color: transparent; - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes elastic-loader { - 0%, 1% { - border-left-color: transparent; - border-bottom-color: transparent; - } - - 1.1%, 50% { - border-left-color: inherit; - } - - 10%, 35.1% { - border-bottom-color: transparent; - } - - 10.1%, 35% { - border-bottom-color: inherit; - } - - 50.1% { - border-left-color: transparent; - } - - 100% { - border-left-color: transparent; - border-bottom-color: transparent; - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@-webkit-keyframes currentcolor-elastic-loader { - 0%, 1% { - border-left-color: transparent; - border-bottom-color: transparent; - } - - 1.1%, 50% { - border-left-color: currentColor; - } - - 10%, 35.1% { - border-bottom-color: transparent; - } - - 10.1%, 35% { - border-bottom-color: currentColor; - } - - 50.1% { - border-left-color: transparent; - } - - 100% { - border-left-color: transparent; - border-bottom-color: transparent; - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes currentcolor-elastic-loader { - 0%, 1% { - border-left-color: transparent; - border-bottom-color: transparent; - } - - 1.1%, 50% { - border-left-color: currentColor; - } - - 10%, 35.1% { - border-bottom-color: transparent; - } - - 10.1%, 35% { - border-bottom-color: currentColor; - } - - 50.1% { - border-left-color: transparent; - } - - 100% { - border-left-color: transparent; - border-bottom-color: transparent; - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -/******************************* - Theme Overrides -*******************************/ - /******************************* Site Overrides *******************************/ @@ -28592,6 +29832,4300 @@ ol.ui.suffixed.list li:before, /******************************* User Variable Overrides *******************************/ +/*! + * # Fomantic-UI 2.8.8 - Loader + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Loader +*******************************/ + +/* Standard Size */ + +.ui.loader { + display: none; + position: absolute; + top: 50%; + left: 50%; + margin: 0; + text-align: center; + z-index: 1000; + -webkit-transform: translateX(-50%) translateY(-50%); + transform: translateX(-50%) translateY(-50%); +} + +/* Static Shape */ + +.ui.loader:before { + position: absolute; + content: ''; + top: 0; + left: 50%; + width: 100%; + height: 100%; + border-radius: 500rem; + border: 0.2em solid rgba(0, 0, 0, 0.1); +} + +/* Active Shape */ + +.ui.loader:after { + position: absolute; + content: ''; + top: 0; + left: 50%; + width: 100%; + height: 100%; + -webkit-animation: loader 0.6s infinite linear; + animation: loader 0.6s infinite linear; + border: 0.2em solid #767676; + border-radius: 500rem; + -webkit-box-shadow: 0 0 0 1px transparent; + box-shadow: 0 0 0 1px transparent; +} + +/* Speeds */ + +.ui.fast.loading.loading:after, +.ui.fast.loading.loading .input > i.icon:after, +.ui.fast.loading.loading > i.icon:after, +.ui.fast.loader:after { + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; +} + +.ui.slow.loading.loading:after, +.ui.slow.loading.loading .input > i.icon:after, +.ui.slow.loading.loading > i.icon:after, +.ui.slow.loader:after { + -webkit-animation-duration: 0.9s; + animation-duration: 0.9s; +} + +/* Active Animation */ + +@-webkit-keyframes loader { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + +@keyframes loader { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + +/*------------------- + Coupling +--------------------*/ + +/* Show inside active dimmer */ + +.ui.dimmer > .loader { + display: block; +} + +/* Black Dimmer */ + +.ui.dimmer > .ui.loader { + color: rgba(255, 255, 255, 0.9); +} + +.ui.dimmer > .ui.loader:not(.elastic):before { + border-color: rgba(255, 255, 255, 0.15); +} + +/* White Dimmer (Inverted) */ + +.ui.inverted.dimmer > .ui.loader { + color: rgba(0, 0, 0, 0.87); +} + +.ui.inverted.dimmer > .ui.loader:not(.elastic):before { + border-color: rgba(0, 0, 0, 0.1); +} + +/******************************* + Types +*******************************/ + +/*------------------- + Text + --------------------*/ + +.ui.ui.ui.ui.text.loader { + width: auto; + height: auto; + text-align: center; + font-style: normal; +} + +/******************************* + States +*******************************/ + +.ui.indeterminate.loader:after { + animation-direction: reverse; + -webkit-animation-duration: 1.2s; + animation-duration: 1.2s; +} + +.ui.loader.active, +.ui.loader.visible { + display: block; +} + +.ui.loader.disabled, +.ui.loader.hidden { + display: none; +} + +/******************************* + Variations +*******************************/ + +/*------------------- + Sizes +--------------------*/ + +.ui.loader { + width: 2.66666667rem; + height: 2.66666667rem; + font-size: 1em; +} + +.ui.loader:before, +.ui.loader:after { + width: 2.66666667rem; + height: 2.66666667rem; + margin: 0 0 0 -1.33333333rem; +} + +.ui.text.loader { + min-width: 2.66666667rem; + padding-top: 3.41666667rem; +} + +.ui.mini.loader { + width: 1.16666667rem; + height: 1.16666667rem; + font-size: 0.75em; +} + +.ui.mini.loader:before, +.ui.mini.loader:after { + width: 1.16666667rem; + height: 1.16666667rem; + margin: 0 0 0 -0.58333333rem; +} + +.ui.mini.text.loader { + min-width: 1.16666667rem; + padding-top: 1.91666667rem; +} + +.ui.tiny.loader { + width: 1.33333333rem; + height: 1.33333333rem; + font-size: 0.83333333em; +} + +.ui.tiny.loader:before, +.ui.tiny.loader:after { + width: 1.33333333rem; + height: 1.33333333rem; + margin: 0 0 0 -0.66666667rem; +} + +.ui.tiny.text.loader { + min-width: 1.33333333rem; + padding-top: 2.08333333rem; +} + +.ui.small.loader { + width: 2rem; + height: 2rem; + font-size: 0.91666667em; +} + +.ui.small.loader:before, +.ui.small.loader:after { + width: 2rem; + height: 2rem; + margin: 0 0 0 -1rem; +} + +.ui.small.text.loader { + min-width: 2rem; + padding-top: 2.75rem; +} + +.ui.large.loader { + width: 4rem; + height: 4rem; + font-size: 1.16666667em; +} + +.ui.large.loader:before, +.ui.large.loader:after { + width: 4rem; + height: 4rem; + margin: 0 0 0 -2rem; +} + +.ui.large.text.loader { + min-width: 4rem; + padding-top: 4.75rem; +} + +.ui.big.loader { + width: 4.33333333rem; + height: 4.33333333rem; + font-size: 1.25em; +} + +.ui.big.loader:before, +.ui.big.loader:after { + width: 4.33333333rem; + height: 4.33333333rem; + margin: 0 0 0 -2.16666667rem; +} + +.ui.big.text.loader { + min-width: 4.33333333rem; + padding-top: 5.08333333rem; +} + +.ui.huge.loader { + width: 4.83333333rem; + height: 4.83333333rem; + font-size: 1.41666667em; +} + +.ui.huge.loader:before, +.ui.huge.loader:after { + width: 4.83333333rem; + height: 4.83333333rem; + margin: 0 0 0 -2.41666667rem; +} + +.ui.huge.text.loader { + min-width: 4.83333333rem; + padding-top: 5.58333333rem; +} + +.ui.massive.loader { + width: 5.33333333rem; + height: 5.33333333rem; + font-size: 1.75em; +} + +.ui.massive.loader:before, +.ui.massive.loader:after { + width: 5.33333333rem; + height: 5.33333333rem; + margin: 0 0 0 -2.66666667rem; +} + +.ui.massive.text.loader { + min-width: 5.33333333rem; + padding-top: 6.08333333rem; +} + +/*------------------- + Colors +--------------------*/ + +.ui.primary.elastic.loader.loader:before, +.ui.primary.basic.elastic.loading.button:before, +.ui.primary.basic.elastic.loading.button:after, +.ui.primary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.primary.elastic.loading.loading.loading .input > i.icon:before, +.ui.primary.elastic.loading.loading.loading.loading > i.icon:before, +.ui.primary.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.primary.loading.loading.loading.loading .input > i.icon:after, +.ui.primary.loading.loading.loading.loading > i.icon:after, +.ui.primary.loader.loader.loader:after { + color: #6435C9; +} + +.ui.inverted.primary.elastic.loader:before, +.ui.inverted.primary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.primary.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.primary.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.primary.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.primary.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.primary.loading.loading.loading.loading > i.icon:after, +.ui.inverted.primary.loader.loader.loader:after { + color: #54C8FF; +} + +.ui.secondary.elastic.loader.loader:before, +.ui.secondary.basic.elastic.loading.button:before, +.ui.secondary.basic.elastic.loading.button:after, +.ui.secondary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.secondary.elastic.loading.loading.loading .input > i.icon:before, +.ui.secondary.elastic.loading.loading.loading.loading > i.icon:before, +.ui.secondary.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.secondary.loading.loading.loading.loading .input > i.icon:after, +.ui.secondary.loading.loading.loading.loading > i.icon:after, +.ui.secondary.loader.loader.loader:after { + color: #1B1C1D; +} + +.ui.inverted.secondary.elastic.loader:before, +.ui.inverted.secondary.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.secondary.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.secondary.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.secondary.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.secondary.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.secondary.loading.loading.loading.loading > i.icon:after, +.ui.inverted.secondary.loader.loader.loader:after { + color: #545454; +} + +.ui.red.elastic.loader.loader:before, +.ui.red.basic.elastic.loading.button:before, +.ui.red.basic.elastic.loading.button:after, +.ui.red.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.red.elastic.loading.loading.loading .input > i.icon:before, +.ui.red.elastic.loading.loading.loading.loading > i.icon:before, +.ui.red.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.red.loading.loading.loading.loading .input > i.icon:after, +.ui.red.loading.loading.loading.loading > i.icon:after, +.ui.red.loader.loader.loader:after { + color: #DB2828; +} + +.ui.inverted.red.elastic.loader:before, +.ui.inverted.red.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.red.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.red.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.red.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.red.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.red.loading.loading.loading.loading > i.icon:after, +.ui.inverted.red.loader.loader.loader:after { + color: #FF695E; +} + +.ui.orange.elastic.loader.loader:before, +.ui.orange.basic.elastic.loading.button:before, +.ui.orange.basic.elastic.loading.button:after, +.ui.orange.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.orange.elastic.loading.loading.loading .input > i.icon:before, +.ui.orange.elastic.loading.loading.loading.loading > i.icon:before, +.ui.orange.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.orange.loading.loading.loading.loading .input > i.icon:after, +.ui.orange.loading.loading.loading.loading > i.icon:after, +.ui.orange.loader.loader.loader:after { + color: #F2711C; +} + +.ui.inverted.orange.elastic.loader:before, +.ui.inverted.orange.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.orange.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.orange.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.orange.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.orange.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.orange.loading.loading.loading.loading > i.icon:after, +.ui.inverted.orange.loader.loader.loader:after { + color: #FF851B; +} + +.ui.yellow.elastic.loader.loader:before, +.ui.yellow.basic.elastic.loading.button:before, +.ui.yellow.basic.elastic.loading.button:after, +.ui.yellow.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.yellow.elastic.loading.loading.loading .input > i.icon:before, +.ui.yellow.elastic.loading.loading.loading.loading > i.icon:before, +.ui.yellow.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.yellow.loading.loading.loading.loading .input > i.icon:after, +.ui.yellow.loading.loading.loading.loading > i.icon:after, +.ui.yellow.loader.loader.loader:after { + color: #FBBD08; +} + +.ui.inverted.yellow.elastic.loader:before, +.ui.inverted.yellow.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.yellow.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.yellow.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.yellow.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.yellow.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.yellow.loading.loading.loading.loading > i.icon:after, +.ui.inverted.yellow.loader.loader.loader:after { + color: #FFE21F; +} + +.ui.olive.elastic.loader.loader:before, +.ui.olive.basic.elastic.loading.button:before, +.ui.olive.basic.elastic.loading.button:after, +.ui.olive.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.olive.elastic.loading.loading.loading .input > i.icon:before, +.ui.olive.elastic.loading.loading.loading.loading > i.icon:before, +.ui.olive.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.olive.loading.loading.loading.loading .input > i.icon:after, +.ui.olive.loading.loading.loading.loading > i.icon:after, +.ui.olive.loader.loader.loader:after { + color: #B5CC18; +} + +.ui.inverted.olive.elastic.loader:before, +.ui.inverted.olive.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.olive.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.olive.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.olive.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.olive.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.olive.loading.loading.loading.loading > i.icon:after, +.ui.inverted.olive.loader.loader.loader:after { + color: #D9E778; +} + +.ui.green.elastic.loader.loader:before, +.ui.green.basic.elastic.loading.button:before, +.ui.green.basic.elastic.loading.button:after, +.ui.green.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.green.elastic.loading.loading.loading .input > i.icon:before, +.ui.green.elastic.loading.loading.loading.loading > i.icon:before, +.ui.green.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.green.loading.loading.loading.loading .input > i.icon:after, +.ui.green.loading.loading.loading.loading > i.icon:after, +.ui.green.loader.loader.loader:after { + color: #21BA45; +} + +.ui.inverted.green.elastic.loader:before, +.ui.inverted.green.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.green.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.green.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.green.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.green.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.green.loading.loading.loading.loading > i.icon:after, +.ui.inverted.green.loader.loader.loader:after { + color: #2ECC40; +} + +.ui.teal.elastic.loader.loader:before, +.ui.teal.basic.elastic.loading.button:before, +.ui.teal.basic.elastic.loading.button:after, +.ui.teal.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.teal.elastic.loading.loading.loading .input > i.icon:before, +.ui.teal.elastic.loading.loading.loading.loading > i.icon:before, +.ui.teal.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.teal.loading.loading.loading.loading .input > i.icon:after, +.ui.teal.loading.loading.loading.loading > i.icon:after, +.ui.teal.loader.loader.loader:after { + color: #00B5AD; +} + +.ui.inverted.teal.elastic.loader:before, +.ui.inverted.teal.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.teal.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.teal.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.teal.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.teal.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.teal.loading.loading.loading.loading > i.icon:after, +.ui.inverted.teal.loader.loader.loader:after { + color: #6DFFFF; +} + +.ui.blue.elastic.loader.loader:before, +.ui.blue.basic.elastic.loading.button:before, +.ui.blue.basic.elastic.loading.button:after, +.ui.blue.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.blue.elastic.loading.loading.loading .input > i.icon:before, +.ui.blue.elastic.loading.loading.loading.loading > i.icon:before, +.ui.blue.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.blue.loading.loading.loading.loading .input > i.icon:after, +.ui.blue.loading.loading.loading.loading > i.icon:after, +.ui.blue.loader.loader.loader:after { + color: #2185D0; +} + +.ui.inverted.blue.elastic.loader:before, +.ui.inverted.blue.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.blue.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.blue.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.blue.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.blue.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.blue.loading.loading.loading.loading > i.icon:after, +.ui.inverted.blue.loader.loader.loader:after { + color: #54C8FF; +} + +.ui.violet.elastic.loader.loader:before, +.ui.violet.basic.elastic.loading.button:before, +.ui.violet.basic.elastic.loading.button:after, +.ui.violet.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.violet.elastic.loading.loading.loading .input > i.icon:before, +.ui.violet.elastic.loading.loading.loading.loading > i.icon:before, +.ui.violet.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.violet.loading.loading.loading.loading .input > i.icon:after, +.ui.violet.loading.loading.loading.loading > i.icon:after, +.ui.violet.loader.loader.loader:after { + color: #6435C9; +} + +.ui.inverted.violet.elastic.loader:before, +.ui.inverted.violet.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.violet.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.violet.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.violet.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.violet.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.violet.loading.loading.loading.loading > i.icon:after, +.ui.inverted.violet.loader.loader.loader:after { + color: #A291FB; +} + +.ui.purple.elastic.loader.loader:before, +.ui.purple.basic.elastic.loading.button:before, +.ui.purple.basic.elastic.loading.button:after, +.ui.purple.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.purple.elastic.loading.loading.loading .input > i.icon:before, +.ui.purple.elastic.loading.loading.loading.loading > i.icon:before, +.ui.purple.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.purple.loading.loading.loading.loading .input > i.icon:after, +.ui.purple.loading.loading.loading.loading > i.icon:after, +.ui.purple.loader.loader.loader:after { + color: #A333C8; +} + +.ui.inverted.purple.elastic.loader:before, +.ui.inverted.purple.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.purple.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.purple.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.purple.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.purple.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.purple.loading.loading.loading.loading > i.icon:after, +.ui.inverted.purple.loader.loader.loader:after { + color: #DC73FF; +} + +.ui.pink.elastic.loader.loader:before, +.ui.pink.basic.elastic.loading.button:before, +.ui.pink.basic.elastic.loading.button:after, +.ui.pink.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.pink.elastic.loading.loading.loading .input > i.icon:before, +.ui.pink.elastic.loading.loading.loading.loading > i.icon:before, +.ui.pink.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.pink.loading.loading.loading.loading .input > i.icon:after, +.ui.pink.loading.loading.loading.loading > i.icon:after, +.ui.pink.loader.loader.loader:after { + color: #E03997; +} + +.ui.inverted.pink.elastic.loader:before, +.ui.inverted.pink.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.pink.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.pink.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.pink.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.pink.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.pink.loading.loading.loading.loading > i.icon:after, +.ui.inverted.pink.loader.loader.loader:after { + color: #FF8EDF; +} + +.ui.brown.elastic.loader.loader:before, +.ui.brown.basic.elastic.loading.button:before, +.ui.brown.basic.elastic.loading.button:after, +.ui.brown.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.brown.elastic.loading.loading.loading .input > i.icon:before, +.ui.brown.elastic.loading.loading.loading.loading > i.icon:before, +.ui.brown.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.brown.loading.loading.loading.loading .input > i.icon:after, +.ui.brown.loading.loading.loading.loading > i.icon:after, +.ui.brown.loader.loader.loader:after { + color: #A5673F; +} + +.ui.inverted.brown.elastic.loader:before, +.ui.inverted.brown.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.brown.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.brown.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.brown.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.brown.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.brown.loading.loading.loading.loading > i.icon:after, +.ui.inverted.brown.loader.loader.loader:after { + color: #D67C1C; +} + +.ui.grey.elastic.loader.loader:before, +.ui.grey.basic.elastic.loading.button:before, +.ui.grey.basic.elastic.loading.button:after, +.ui.grey.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.grey.elastic.loading.loading.loading .input > i.icon:before, +.ui.grey.elastic.loading.loading.loading.loading > i.icon:before, +.ui.grey.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.grey.loading.loading.loading.loading .input > i.icon:after, +.ui.grey.loading.loading.loading.loading > i.icon:after, +.ui.grey.loader.loader.loader:after { + color: #767676; +} + +.ui.inverted.grey.elastic.loader:before, +.ui.inverted.grey.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.grey.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.grey.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.grey.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.grey.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.grey.loading.loading.loading.loading > i.icon:after, +.ui.inverted.grey.loader.loader.loader:after { + color: #DCDDDE; +} + +.ui.black.elastic.loader.loader:before, +.ui.black.basic.elastic.loading.button:before, +.ui.black.basic.elastic.loading.button:after, +.ui.black.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.black.elastic.loading.loading.loading .input > i.icon:before, +.ui.black.elastic.loading.loading.loading.loading > i.icon:before, +.ui.black.loading.loading.loading.loading:not(.usual):not(.button):after, +.ui.black.loading.loading.loading.loading .input > i.icon:after, +.ui.black.loading.loading.loading.loading > i.icon:after, +.ui.black.loader.loader.loader:after { + color: #1B1C1D; +} + +.ui.inverted.black.elastic.loader:before, +.ui.inverted.black.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before, +.ui.inverted.black.elastic.loading.loading.loading .input > i.icon:before, +.ui.inverted.black.elastic.loading.loading.loading > i.icon:before, +.ui.inverted.black.loading.loading.loading.loading:not(.usual):after, +.ui.inverted.black.loading.loading.loading.loading .input > i.icon:after, +.ui.inverted.black.loading.loading.loading.loading > i.icon:after, +.ui.inverted.black.loader.loader.loader:after { + color: #545454; +} + +.ui.elastic.loader.loader:before, +.ui.elastic.loading.loading.loading:before, +.ui.elastic.loading.loading.loading .input > i.icon:before, +.ui.elastic.loading.loading.loading > i.icon:before, +.ui.loading.loading.loading.loading:not(.usual):after, +.ui.loading.loading.loading.loading .input > i.icon:after, +.ui.loading.loading.loading.loading > i.icon:after, +.ui.loader.loader.loader:after { + border-color: currentColor; +} + +.ui.elastic.loading.loading.loading.loading.button:not(.inverted):not(.basic):before { + color: #FFFFFF; +} + +.ui.elastic.basic.loading.button:before, +.ui.elastic.basic.loading.button:after { + color: #767676; +} + +.ui.double.loading.loading.loading.loading.button:after { + border-bottom-color: currentColor; +} + +/*------------------- + Inline + --------------------*/ + +.ui.inline.loader { + position: relative; + vertical-align: middle; + margin: 0; + left: 0; + top: 0; + -webkit-transform: none; + transform: none; +} + +.ui.inline.loader.active, +.ui.inline.loader.visible { + display: inline-block; +} + +/* Centered Inline */ + +.ui.centered.inline.loader.active, +.ui.centered.inline.loader.visible { + display: block; + margin-left: auto; + margin-right: auto; +} + +.ui.loading.loading.loading.loading.loading.loading:after, +.ui.loading.loading.loading.loading.loading.loading .input > i.icon:after, +.ui.loading.loading.loading.loading.loading.loading > i.icon:after, +.ui.loader.loader.loader.loader.loader:after { + border-left-color: transparent; + border-right-color: transparent; +} + +.ui.loading.loading.loading.loading.loading.loading.loading:not(.double):after, +.ui.loading.loading.loading.loading.loading.loading.loading:not(.double) .input > i.icon:after, +.ui.loading.loading.loading.loading.loading.loading.loading:not(.double) > i.icon:after, +.ui.loader.loader.loader.loader.loader.loader:not(.double):after { + border-bottom-color: transparent; +} + +.ui.loading.loading.loading.loading.loading.loading.card:after, +.ui.loading.loading.loading.loading.loading.loading.segments:after, +.ui.loading.loading.loading.loading.loading.loading.segment:after, +.ui.loading.loading.loading.loading.loading.loading.form:after { + border-left-color: rgba(0, 0, 0, 0.1); + border-right-color: rgba(0, 0, 0, 0.1); +} + +.ui.loading.loading.loading.loading.loading.loading.card:not(.double):after, +.ui.loading.loading.loading.loading.loading.loading.segments:not(.double):after, +.ui.loading.loading.loading.loading.loading.loading.segment:not(.double):after, +.ui.loading.loading.loading.loading.loading.loading.form:not(.double):after { + border-bottom-color: rgba(0, 0, 0, 0.1); +} + +/*------------------- + Elastic + --------------------*/ + +.ui.dimmer > .ui.elastic.loader { + color: #FFFFFF; +} + +.ui.inverted.dimmer > .ui.elastic.loader { + color: #767676; +} + +.ui.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after, +.ui.elastic.loading.loading .input > i.icon:after, +.ui.elastic.loading.loading > i.icon:after, +.ui.elastic.loader.loader:after { + -webkit-animation: loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); + animation: loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); + -webkit-animation-delay: 0.3s; + animation-delay: 0.3s; +} + +.ui.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before, +.ui.elastic.loading.loading.loading .input > i.icon:before, +.ui.elastic.loading.loading.loading > i.icon:before, +.ui.elastic.loader.loader:before { + -webkit-animation: elastic-loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); + animation: elastic-loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); + -moz-animation: currentcolor-elastic-loader 1s infinite cubic-bezier(0.27, 1.05, 0.92, 0.61); + border-right-color: transparent; +} + +.ui.elastic.inline.loader:empty { + -webkit-animation: loader 8s infinite linear; + animation: loader 8s infinite linear; +} + +.ui.slow.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after, +.ui.slow.elastic.loading.loading .input > i.icon:after, +.ui.slow.elastic.loading.loading > i.icon:after, +.ui.slow.elastic.loader.loader:after { + -webkit-animation-duration: 1.5s; + animation-duration: 1.5s; + -webkit-animation-delay: 0.45s; + animation-delay: 0.45s; +} + +.ui.slow.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before, +.ui.slow.elastic.loading.loading.loading .input > i.icon:before, +.ui.slow.elastic.loading.loading.loading > i.icon:before, +.ui.slow.elastic.loader.loader:before { + -webkit-animation-duration: 1.5s; + animation-duration: 1.5s; +} + +.ui.fast.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after, +.ui.fast.elastic.loading.loading .input > i.icon:after, +.ui.fast.elastic.loading.loading > i.icon:after, +.ui.fast.elastic.loader.loader:after { + -webkit-animation-duration: 0.66s; + animation-duration: 0.66s; + -webkit-animation-delay: 0.2s; + animation-delay: 0.2s; +} + +.ui.fast.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before, +.ui.fast.elastic.loading.loading.loading .input > i.icon:before, +.ui.fast.elastic.loading.loading.loading > i.icon:before, +.ui.fast.elastic.loader.loader:before { + -webkit-animation-duration: 0.66s; + animation-duration: 0.66s; +} + +@-webkit-keyframes elastic-loader { + 0%, 1% { + border-left-color: transparent; + border-bottom-color: transparent; + } + + 1.1%, 50% { + border-left-color: inherit; + } + + 10%, 35.1% { + border-bottom-color: transparent; + } + + 10.1%, 35% { + border-bottom-color: inherit; + } + + 50.1% { + border-left-color: transparent; + } + + 100% { + border-left-color: transparent; + border-bottom-color: transparent; + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + +@keyframes elastic-loader { + 0%, 1% { + border-left-color: transparent; + border-bottom-color: transparent; + } + + 1.1%, 50% { + border-left-color: inherit; + } + + 10%, 35.1% { + border-bottom-color: transparent; + } + + 10.1%, 35% { + border-bottom-color: inherit; + } + + 50.1% { + border-left-color: transparent; + } + + 100% { + border-left-color: transparent; + border-bottom-color: transparent; + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + +@-webkit-keyframes currentcolor-elastic-loader { + 0%, 1% { + border-left-color: transparent; + border-bottom-color: transparent; + } + + 1.1%, 50% { + border-left-color: currentColor; + } + + 10%, 35.1% { + border-bottom-color: transparent; + } + + 10.1%, 35% { + border-bottom-color: currentColor; + } + + 50.1% { + border-left-color: transparent; + } + + 100% { + border-left-color: transparent; + border-bottom-color: transparent; + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + +@keyframes currentcolor-elastic-loader { + 0%, 1% { + border-left-color: transparent; + border-bottom-color: transparent; + } + + 1.1%, 50% { + border-left-color: currentColor; + } + + 10%, 35.1% { + border-bottom-color: transparent; + } + + 10.1%, 35% { + border-bottom-color: currentColor; + } + + 50.1% { + border-left-color: transparent; + } + + 100% { + border-left-color: transparent; + border-bottom-color: transparent; + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} + +/******************************* + Theme Overrides +*******************************/ + +/******************************* + Site Overrides +*******************************/ +/* + * # Fomantic - Menu + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Copyright 2015 Contributor + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Standard +*******************************/ + +/*-------------- + Menu +---------------*/ + +.ui.menu { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + margin: 1rem 0; + font-family: 'Raleway', sans-serif; + background: #FFFFFF; + font-weight: normal; + border: 1px solid rgba(34, 36, 38, 0.15); + -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); + border-radius: 0.33333333rem; + min-height: 2.83333333em; +} + +.ui.menu:after { + content: ''; + display: block; + height: 0; + clear: both; + visibility: hidden; +} + +.ui.menu:first-child { + margin-top: 0; +} + +.ui.menu:last-child { + margin-bottom: 0; +} + +/*-------------- + Sub-Menu +---------------*/ + +.ui.menu .menu { + margin: 0; +} + +.ui.menu:not(.vertical) > .menu { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +/*-------------- + Item +---------------*/ + +.ui.menu:not(.vertical) .item { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; +} + +.ui.menu .item { + position: relative; + vertical-align: middle; + line-height: 1; + text-decoration: none; + -webkit-tap-highlight-color: transparent; + -webkit-box-flex: 0; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + background: none; + padding: 0.91666667em 1.16666667em; + text-transform: none; + color: rgba(0, 0, 0, 0.87); + font-weight: normal; + -webkit-transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease; + transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; +} + +.ui.menu > .item:first-child { + border-radius: 0.33333333rem 0 0 0.33333333rem; +} + +/* Border */ + +.ui.menu .item:before { + position: absolute; + content: ''; + top: 0; + right: 0; + height: 100%; + width: 1px; + background: rgba(34, 36, 38, 0.1); +} + +/*-------------- + Text Content +---------------*/ + +.ui.menu .text.item > *, +.ui.menu .item > a:not(.ui), +.ui.menu .item > p:only-child { + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; + line-height: 1.3; +} + +.ui.menu .item > p:first-child { + margin-top: 0; +} + +.ui.menu .item > p:last-child { + margin-bottom: 0; +} + +/*-------------- + Icons +---------------*/ + +.ui.menu .item > i.icon { + opacity: 0.9; + float: none; + margin: 0 0.41666667em 0 0; +} + +/*-------------- + Button +---------------*/ + +.ui.menu:not(.vertical) .item > .button { + position: relative; + top: 0; + margin: -0.5em 0; + padding-bottom: 0.75em; + padding-top: 0.75em; + font-size: 1em; +} + +/*---------------- + Grid / Container +-----------------*/ + +.ui.menu > .grid, +.ui.menu > .container { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: inherit; + -ms-flex-align: inherit; + align-items: inherit; + -webkit-box-orient: inherit; + -webkit-box-direction: inherit; + -ms-flex-direction: inherit; + flex-direction: inherit; +} + +/*-------------- + Inputs +---------------*/ + +.ui.menu .item > .input { + width: 100%; +} + +.ui.menu:not(.vertical) .item > .input { + position: relative; + top: 0; + margin: -0.5em 0; +} + +.ui.menu .item > .input input { + font-size: 1em; + padding-top: 0.66666667em; + padding-bottom: 0.66666667em; +} + +/*-------------- + Header +---------------*/ + +.ui.menu .header.item, +.ui.vertical.menu .header.item { + margin: 0; + background: ''; + text-transform: normal; + font-weight: bold; +} + +.ui.vertical.menu .item > .header:not(.ui) { + margin: 0 0 0.5em; + font-size: 1em; + font-weight: bold; +} + +/*-------------- + Dropdowns +---------------*/ + +/* Dropdown Icon */ + +.ui.menu .item > i.dropdown.icon { + padding: 0; + float: right; + margin: 0 0 0 1em; +} + +/* Menu */ + +.ui.menu .dropdown.item .menu { + min-width: calc(100% - 1px); + border-radius: 0 0 0.33333333rem 0.33333333rem; + background: #FFFFFF; + margin: 0 0 0; + -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); +} + +.ui.menu .dropdown.item:not(.column) .menu { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; +} + +/* Menu Items */ + +.ui.menu .ui.dropdown .menu > .item { + margin: 0; + text-align: left; + font-size: 1em !important; + padding: 0.75em 1.16666667em !important; + background: transparent !important; + color: rgba(0, 0, 0, 0.87) !important; + text-transform: none !important; + font-weight: normal !important; + -webkit-box-shadow: none !important; + box-shadow: none !important; + -webkit-transition: none !important; + transition: none !important; +} + +.ui.menu .ui.dropdown .menu > .item:hover { + background: rgba(0, 0, 0, 0.05) !important; + color: rgba(0, 0, 0, 0.95) !important; +} + +.ui.menu .ui.dropdown .menu > .selected.item { + background: rgba(0, 0, 0, 0.05) !important; + color: rgba(0, 0, 0, 0.95) !important; +} + +.ui.menu .ui.dropdown .menu > .active.item { + background: rgba(0, 0, 0, 0.03) !important; + font-weight: bold !important; + color: rgba(0, 0, 0, 0.95) !important; +} + +.ui.menu .ui.dropdown.item .menu .item:not(.filtered) { + display: block; +} + +.ui.menu .ui.dropdown .menu > .item > .icons, +.ui.menu .ui.dropdown .menu > .item > i.icon:not(.dropdown) { + display: inline-block; + font-size: 1em !important; + float: none; + margin: 0 0.75em 0 0 !important; +} + +/* Secondary */ + +.ui.secondary.menu .dropdown.item > .menu, +.ui.text.menu .dropdown.item > .menu { + border-radius: 0.33333333rem; + margin-top: 0.41666667em; +} + +/* Pointing */ + +.ui.menu .pointing.dropdown.item .menu { + margin-top: 0.75em; +} + +/* Inverted */ + +.ui.inverted.menu .search.dropdown.item > .search, +.ui.inverted.menu .search.dropdown.item > .text { + color: rgba(255, 255, 255, 0.9); +} + +/* Vertical */ + +.ui.vertical.menu .dropdown.item > i.icon { + float: right; + content: "\f0da"; + margin-left: 1em; +} + +.ui.vertical.menu .dropdown.item .menu { + left: 100%; + /* IE needs 0, all others support max-content to show dropdown icon inline, so keep both settings! */ + min-width: 0; + min-width: -webkit-max-content; + min-width: -moz-max-content; + min-width: max-content; + margin: 0 0 0 0; + -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); + border-radius: 0 0.33333333rem 0.33333333rem 0.33333333rem; +} + +.ui.vertical.menu .dropdown.item.upward .menu { + bottom: 0; +} + +.ui.vertical.menu .dropdown.item:not(.upward) .menu { + top: 0; +} + +.ui.vertical.menu .active.dropdown.item { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.ui.vertical.menu .dropdown.active.item { + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Evenly Divided */ + +.ui.item.menu .dropdown .menu .item { + width: 100%; +} + +/*-------------- + Labels +---------------*/ + +.ui.menu .item > .label:not(.floating) { + margin-left: 1em; + padding: 0.3em 0.75em; +} + +.ui.vertical.menu .item > .label { + margin-top: -0.15em; + margin-bottom: -0.15em; + padding: 0.3em 0.75em; +} + +.ui.menu .item > .floating.label { + padding: 0.3em 0.75em; +} + +.ui.menu .item > .label { + background: #999999; + color: #FFFFFF; +} + +.ui.menu .item > .image.label img { + margin: -0.2833em 0.8em -0.2833em -0.8em; + height: 1.5666em; +} + +/*-------------- + Images +---------------*/ + +.ui.menu .item > img:not(.ui) { + display: inline-block; + vertical-align: middle; + margin: -0.3em 0; + width: 2.5em; +} + +.ui.vertical.menu .item > img:not(.ui):only-child { + display: block; + max-width: 100%; + width: auto; +} + +/******************************* + Coupling +*******************************/ + +/*-------------- + List +---------------*/ + +/* Menu divider shouldnt apply */ + +.ui.menu .list .item:before { + background: none !important; +} + +/*-------------- + Sidebar + ---------------*/ + +/* Show vertical dividers below last */ + +.ui.vertical.sidebar.menu > .item:first-child:before { + display: block !important; +} + +.ui.vertical.sidebar.menu > .item::before { + top: auto; + bottom: 0; +} + +/*-------------- + Container +---------------*/ + +@media only screen and (max-width: 767.98px) { + .ui.menu > .ui.container { + width: 100% !important; + margin-left: 0 !important; + margin-right: 0 !important; + } +} + +@media only screen and (min-width: 768px) { + .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .item:not(.right):not(.borderless):first-child { + border-left: 1px solid rgba(34, 36, 38, 0.1); + } + + .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .right.item:not(.borderless):last-child, + .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .right.menu > .item:not(.borderless):last-child { + border-right: 1px solid rgba(34, 36, 38, 0.1); + } +} + +/******************************* + States +*******************************/ + +/*-------------- + Hover +---------------*/ + +.ui.link.menu .item:hover, +.ui.menu .dropdown.item:hover, +.ui.menu .link.item:hover, +.ui.menu a.item:hover { + cursor: pointer; + background: rgba(0, 0, 0, 0.03); + color: rgba(0, 0, 0, 0.95); +} + +/*-------------- + Pressed +---------------*/ + +.ui.link.menu .item:active, +.ui.menu .link.item:active, +.ui.menu a.item:active { + background: rgba(0, 0, 0, 0.03); + color: rgba(0, 0, 0, 0.95); +} + +/*-------------- + Active +---------------*/ + +.ui.menu .active.item { + background: rgba(0, 0, 0, 0.05); + color: rgba(0, 0, 0, 0.95); + font-weight: normal; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.menu .active.item > i.icon { + opacity: 1; +} + +/*-------------- + Active Hover +---------------*/ + +.ui.menu .active.item:hover, +.ui.vertical.menu .active.item:hover { + background-color: rgba(0, 0, 0, 0.05); + color: rgba(0, 0, 0, 0.95); +} + +/*-------------- + Disabled +---------------*/ + +.ui.ui.menu .item.disabled { + cursor: default; + background-color: transparent; + color: rgba(40, 40, 40, 0.3); + pointer-events: none; +} + +/******************************* + Types +*******************************/ + +/*------------------ +Floated Menu / Item +-------------------*/ + +/* Left Floated */ + +.ui.menu:not(.vertical) .left.item, +.ui.menu:not(.vertical) .left.menu { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + margin-right: auto !important; +} + +/* Right Floated */ + +.ui.menu:not(.vertical) .right.item, +.ui.menu:not(.vertical) .right.menu { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + margin-left: auto !important; +} + +.ui.menu:not(.vertical) :not(.dropdown) > .left.menu, +.ui.menu:not(.vertical) :not(.dropdown) > .right.menu { + display: inherit; +} + +/* Center */ + +.ui.menu:not(.vertical) .center.item, +.ui.menu:not(.vertical) .center.menu { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + margin-left: auto !important; + margin-right: auto !important; +} + +/* Swapped Borders */ + +.ui.menu .right.item::before, +.ui.menu .right.menu > .item::before { + right: auto; + left: 0; +} + +/* Remove Outer Borders */ + +.ui.menu .center.item:last-child::before, +.ui.menu .center.menu > .item:last-child::before { + display: none; +} + +/*-------------- + Vertical + ---------------*/ + +.ui.vertical.menu { + display: block; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + background: #FFFFFF; + -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); +} + +/*--- Item ---*/ + +.ui.vertical.menu .item { + display: block; + background: none; + border-top: none; + border-right: none; +} + +.ui.vertical.menu > .item:first-child { + border-radius: 0.33333333rem 0.33333333rem 0 0; +} + +.ui.vertical.menu > .item:last-child { + border-radius: 0 0 0.33333333rem 0.33333333rem; +} + +/*--- Label ---*/ + +.ui.vertical.menu .item > .label { + float: right; + text-align: center; +} + +/*--- Icon ---*/ + +.ui.vertical.menu .item > i.icon, +.ui.vertical.menu .item > i.icons { + width: 1.18em; + float: right; + margin: 0 0 0 0.5em; +} + +.ui.vertical.menu .item > .label + i.icon { + float: none; + margin: 0 0.5em 0 0; +} + +/*--- Border ---*/ + +.ui.vertical.menu .item:before { + position: absolute; + content: ''; + top: 0; + left: 0; + width: 100%; + height: 1px; + background: rgba(34, 36, 38, 0.1); +} + +.ui.vertical.menu .item:first-child:before { + display: none !important; +} + +/*--- Sub Menu ---*/ + +.ui.vertical.menu .item > .menu { + margin: 0.5em -1.16666667em 0; +} + +.ui.vertical.menu .menu .item { + background: none; + padding: 0.5em 1.36111111em; + font-size: 0.83333333em; + color: rgba(0, 0, 0, 0.5); +} + +.ui.vertical.menu .item .menu a.item:hover, +.ui.vertical.menu .item .menu .link.item:hover { + color: rgba(0, 0, 0, 0.85); +} + +.ui.vertical.menu .menu .item:before { + display: none; +} + +/* Vertical Active */ + +.ui.vertical.menu .active.item { + background: rgba(0, 0, 0, 0.05); + border-radius: 0; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.vertical.menu > .active.item:first-child { + border-radius: 0.33333333rem 0.33333333rem 0 0; +} + +.ui.vertical.menu > .active.item:last-child { + border-radius: 0 0 0.33333333rem 0.33333333rem; +} + +.ui.vertical.menu > .active.item:only-child { + border-radius: 0.33333333rem; +} + +.ui.vertical.menu .active.item .menu .active.item { + border-left: none; +} + +.ui.vertical.menu .item .menu .active.item { + background-color: transparent; + font-weight: bold; + color: rgba(0, 0, 0, 0.95); +} + +/*-------------- + Tabular + ---------------*/ + +.ui.tabular.menu { + border-radius: 0; + -webkit-box-shadow: none !important; + box-shadow: none !important; + border: none; + background: none transparent; + border-bottom: 1px solid #D4D4D5; +} + +.ui.tabular.fluid.menu { + width: calc(100% + 2px) !important; +} + +.ui.tabular.menu .item { + background: transparent; + border-bottom: none; + border-left: 1px solid transparent; + border-right: 1px solid transparent; + border-top: 2px solid transparent; + padding: 0.91666667em 1.41666667em; + color: rgba(0, 0, 0, 0.87); +} + +.ui.tabular.menu .item:before { + display: none; +} + +/* Hover */ + +.ui.tabular.menu .item:hover { + background-color: transparent; + color: rgba(0, 0, 0, 0.8); +} + +/* Active */ + +.ui.tabular.menu .active.item { + background: none #FFFFFF; + color: rgba(0, 0, 0, 0.95); + border-top-width: 1px; + border-color: #D4D4D5; + font-weight: bold; + margin-bottom: -1px; + -webkit-box-shadow: none; + box-shadow: none; + border-radius: 0.33333333rem 0.33333333rem 0 0 !important; +} + +/* Coupling with segment for attachment */ + +.ui.tabular.menu + .attached:not(.top).segment, +.ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment { + border-top: none; + margin-left: 0; + margin-top: 0; + margin-right: 0; + width: 100%; +} + +.top.attached.segment + .ui.bottom.tabular.menu { + position: relative; + width: calc(100% + 2px); + left: -1px; +} + +/* Bottom Vertical Tabular */ + +.ui.bottom.tabular.menu { + background: none transparent; + border-radius: 0; + -webkit-box-shadow: none !important; + box-shadow: none !important; + border-bottom: none; + border-top: 1px solid #D4D4D5; +} + +.ui.bottom.tabular.menu .item { + background: none; + border-left: 1px solid transparent; + border-right: 1px solid transparent; + border-bottom: 1px solid transparent; + border-top: none; +} + +.ui.bottom.tabular.menu .active.item { + background: none #FFFFFF; + color: rgba(0, 0, 0, 0.95); + border-color: #D4D4D5; + margin: -1px 0 0 0; + border-radius: 0 0 0.33333333rem 0.33333333rem !important; +} + +/* Vertical Tabular (Left) */ + +.ui.vertical.tabular.menu { + background: none transparent; + border-radius: 0; + -webkit-box-shadow: none !important; + box-shadow: none !important; + border-bottom: none; + border-right: 1px solid #D4D4D5; +} + +.ui.vertical.tabular.menu .item { + background: none; + border-left: 1px solid transparent; + border-bottom: 1px solid transparent; + border-top: 1px solid transparent; + border-right: none; +} + +.ui.vertical.tabular.menu .active.item { + background: none #FFFFFF; + color: rgba(0, 0, 0, 0.95); + border-color: #D4D4D5; + margin: 0 -1px 0 0; + border-radius: 0.33333333rem 0 0 0.33333333rem !important; +} + +/* Vertical Right Tabular */ + +.ui.vertical.right.tabular.menu { + background: none transparent; + border-radius: 0; + -webkit-box-shadow: none !important; + box-shadow: none !important; + border-bottom: none; + border-right: none; + border-left: 1px solid #D4D4D5; +} + +.ui.vertical.right.tabular.menu .item { + background: none; + border-right: 1px solid transparent; + border-bottom: 1px solid transparent; + border-top: 1px solid transparent; + border-left: none; +} + +.ui.vertical.right.tabular.menu .active.item { + background: none #FFFFFF; + color: rgba(0, 0, 0, 0.95); + border-color: #D4D4D5; + margin: 0 0 0 -1px; + border-radius: 0 0.33333333rem 0.33333333rem 0 !important; +} + +/* Dropdown */ + +.ui.tabular.menu .active.dropdown.item { + margin-bottom: 0; + border-left: 1px solid transparent; + border-right: 1px solid transparent; + border-top: 2px solid transparent; + border-bottom: none; +} + +/*-------------- + Pagination + ---------------*/ + +.ui.pagination.menu { + margin: 0; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + vertical-align: middle; +} + +.ui.pagination.menu .item:last-child { + border-radius: 0 0.33333333rem 0.33333333rem 0; +} + +.ui.compact.menu .item:last-child { + border-radius: 0 0.33333333rem 0.33333333rem 0; +} + +.ui.pagination.menu .item:last-child:before { + display: none; +} + +.ui.pagination.menu .item { + min-width: 3em; + text-align: center; +} + +.ui.pagination.menu .icon.item i.icon { + vertical-align: top; +} + +/* Active */ + +.ui.pagination.menu .active.item { + border-top: none; + padding-top: 0.91666667em; + background-color: rgba(0, 0, 0, 0.05); + color: rgba(0, 0, 0, 0.95); + -webkit-box-shadow: none; + box-shadow: none; +} + +/*-------------- + Secondary + ---------------*/ + +.ui.secondary.menu { + background: none; + margin-left: -0.41666667em; + margin-right: -0.41666667em; + border-radius: 0; + border: none; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Item */ + +.ui.secondary.menu .item { + -ms-flex-item-align: center; + align-self: center; + -webkit-box-shadow: none; + box-shadow: none; + border: none; + padding: 0.75em 0.91666667em; + margin: 0 0.41666667em; + background: none; + -webkit-transition: color 0.1s ease; + transition: color 0.1s ease; + border-radius: 0.33333333rem; +} + +/* No Divider */ + +.ui.secondary.menu .item:before { + display: none !important; +} + +/* Header */ + +.ui.secondary.menu .header.item { + border-radius: 0; + border-right: none; + background: none transparent; +} + +/* Image */ + +.ui.secondary.menu .item > img:not(.ui) { + margin: 0; +} + +/* Hover */ + +.ui.secondary.menu .dropdown.item:hover, +.ui.secondary.menu .link.item:hover, +.ui.secondary.menu a.item:hover { + background: rgba(0, 0, 0, 0.05); + color: rgba(0, 0, 0, 0.95); +} + +/* Active */ + +.ui.secondary.menu .active.item { + -webkit-box-shadow: none; + box-shadow: none; + background: rgba(0, 0, 0, 0.05); + color: rgba(0, 0, 0, 0.95); + border-radius: 0.33333333rem; +} + +/* Active Hover */ + +.ui.secondary.menu .active.item:hover { + -webkit-box-shadow: none; + box-shadow: none; + background: rgba(0, 0, 0, 0.05); + color: rgba(0, 0, 0, 0.95); +} + +/* Inverted */ + +.ui.secondary.inverted.menu .link.item:not(.disabled), +.ui.secondary.inverted.menu a.item:not(.disabled) { + color: rgba(255, 255, 255, 0.7); +} + +.ui.secondary.inverted.menu .dropdown.item:hover, +.ui.secondary.inverted.menu .link.item:hover, +.ui.secondary.inverted.menu a.item:hover { + background: rgba(255, 255, 255, 0.08); + color: #ffffff; +} + +.ui.secondary.inverted.menu .active.item { + background: rgba(255, 255, 255, 0.15); + color: #ffffff; +} + +/* Fix item margins */ + +.ui.secondary.item.menu { + margin-left: 0; + margin-right: 0; +} + +.ui.secondary.item.menu .item:last-child { + margin-right: 0; +} + +.ui.secondary.attached.menu { + -webkit-box-shadow: none; + box-shadow: none; +} + +/*--------------------- + Secondary Vertical + -----------------------*/ + +/* Sub Menu */ + +.ui.vertical.secondary.menu .item:not(.dropdown) > .menu { + margin: 0 -0.91666667em; +} + +.ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item { + margin: 0; + padding: 0.58333333em 1.36111111em; +} + +.ui.secondary.vertical.menu > .item { + border: none; + margin: 0 0 0.41666667em; + border-radius: 0.33333333rem !important; +} + +.ui.secondary.vertical.menu > .header.item { + border-radius: 0; +} + +/* Sub Menu */ + +.ui.vertical.secondary.menu .item > .menu .item { + background-color: transparent; +} + +/* Inverted */ + +.ui.secondary.inverted.menu { + background-color: transparent; +} + +/*--------------------- + Secondary Pointing + -----------------------*/ + +.ui.secondary.pointing.menu { + margin-left: 0; + margin-right: 0; + border-bottom: 2px solid rgba(34, 36, 38, 0.15); +} + +.ui.secondary.pointing.menu .item { + border-bottom-color: transparent; + border-bottom-style: solid; + border-radius: 0; + -ms-flex-item-align: end; + align-self: flex-end; + margin: 0 0 -2px; + padding: 0.83333333em 1.16666667em; + border-bottom-width: 2px; + -webkit-transition: color 0.1s ease; + transition: color 0.1s ease; +} + +.ui.secondary.pointing.menu .ui.dropdown .menu .item { + border-bottom-width: 0; +} + +.ui.secondary.pointing.menu .item > .label:not(.floating) { + margin-top: -0.3em; + margin-bottom: -0.3em; +} + +.ui.secondary.pointing.menu .item > .circular.label { + margin-top: -0.5em; + margin-bottom: -0.5em; +} + +/* Item Types */ + +.ui.secondary.pointing.menu .header.item { + color: rgba(0, 0, 0, 0.85) !important; +} + +.ui.secondary.pointing.menu .text.item { + -webkit-box-shadow: none !important; + box-shadow: none !important; +} + +.ui.secondary.pointing.menu .item:after { + display: none; +} + +/* Hover */ + +.ui.secondary.pointing.menu .dropdown.item:hover, +.ui.secondary.pointing.menu .link.item:hover, +.ui.secondary.pointing.menu a.item:hover { + background-color: transparent; + color: rgba(0, 0, 0, 0.87); +} + +/* Pressed */ + +.ui.secondary.pointing.menu .dropdown.item:active, +.ui.secondary.pointing.menu .link.item:active, +.ui.secondary.pointing.menu a.item:active { + background-color: transparent; + border-color: rgba(34, 36, 38, 0.15); +} + +/* Active */ + +.ui.secondary.pointing.menu .active.item { + background-color: transparent; + -webkit-box-shadow: none; + box-shadow: none; + border-color: currentColor; + font-weight: bold; + color: rgba(0, 0, 0, 0.95); +} + +/* Active Hover */ + +.ui.secondary.pointing.menu .active.item:hover { + border-color: currentColor; + color: rgba(0, 0, 0, 0.95); +} + +/* Active Dropdown */ + +.ui.secondary.pointing.menu .active.dropdown.item { + border-color: transparent; +} + +/* Vertical Pointing */ + +.ui.secondary.vertical.pointing.menu { + border-bottom-width: 0; + border-right-width: 2px; + border-right-style: solid; + border-right-color: rgba(34, 36, 38, 0.15); +} + +.ui.secondary.vertical.pointing.menu .item { + border-bottom: none; + border-right-style: solid; + border-right-color: transparent; + border-radius: 0 !important; + margin: 0 -2px 0 0; + border-right-width: 2px; +} + +/* Vertical Active */ + +.ui.secondary.vertical.pointing.menu .active.item { + border-color: currentColor; +} + +/* Inverted */ + +.ui.secondary.inverted.pointing.menu { + border-color: rgba(255, 255, 255, 0.1); +} + +.ui.secondary.inverted.pointing.menu .item:not(.disabled) { + color: rgba(255, 255, 255, 0.9); +} + +.ui.secondary.inverted.pointing.menu .header.item { + color: #FFFFFF !important; +} + +/* Hover */ + +.ui.secondary.inverted.pointing.menu .link.item:hover, +.ui.secondary.inverted.pointing.menu a.item:hover { + color: #ffffff; +} + +/* Active */ + +.ui.ui.secondary.inverted.pointing.menu .active.item { + border-color: #FFFFFF; + color: #ffffff; + background-color: transparent; +} + +/*-------------- + Text Menu + ---------------*/ + +.ui.text.menu { + background: none transparent; + border-radius: 0; + -webkit-box-shadow: none; + box-shadow: none; + border: none; + margin: 1em -0.58333333em; +} + +.ui.text.menu .item { + border-radius: 0; + -webkit-box-shadow: none; + box-shadow: none; + -ms-flex-item-align: center; + align-self: center; + margin: 0 0; + padding: 0.41666667em 0.58333333em; + font-weight: normal; + color: rgba(0, 0, 0, 0.6); + -webkit-transition: opacity 0.1s ease; + transition: opacity 0.1s ease; +} + +/* Border */ + +.ui.text.menu .item:before, +.ui.text.menu .menu .item:before { + display: none !important; +} + +/* Header */ + +.ui.text.menu .header.item { + background-color: transparent; + opacity: 1; + color: rgba(0, 0, 0, 0.85); + font-size: 0.91666667em; + text-transform: uppercase; + font-weight: bold; +} + +/* Image */ + +.ui.text.menu .item > img:not(.ui) { + margin: 0; +} + +/*--- fluid text ---*/ + +.ui.text.item.menu .item { + margin: 0; +} + +/*--- vertical text ---*/ + +.ui.vertical.text.menu { + margin: 1em 0; +} + +.ui.vertical.text.menu:first-child { + margin-top: 0; +} + +.ui.vertical.text.menu:last-child { + margin-bottom: 0; +} + +.ui.vertical.text.menu .item { + margin: 0.66666667em 0; + padding-left: 0; + padding-right: 0; +} + +.ui.vertical.text.menu .item > i.icon { + float: none; + margin: 0 0.41666667em 0 0; +} + +.ui.vertical.text.menu .header.item { + margin: 0.66666667em 0 0.83333333em; +} + +/* Vertical Sub Menu */ + +.ui.vertical.text.menu .item:not(.dropdown) > .menu { + margin: 0; +} + +.ui.vertical.text.menu .item:not(.dropdown) > .menu > .item { + margin: 0; + padding: 0.58333333em 0; +} + +/*--- hover ---*/ + +.ui.text.menu .item:hover { + opacity: 1; + background-color: transparent; +} + +/*--- active ---*/ + +.ui.text.menu .active.item { + background-color: transparent; + border: none; + -webkit-box-shadow: none; + box-shadow: none; + font-weight: normal; + color: rgba(0, 0, 0, 0.95); +} + +/*--- active hover ---*/ + +.ui.text.menu .active.item:hover { + background-color: transparent; +} + +/* Disable Bariations */ + +.ui.text.pointing.menu .active.item:after { + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.text.attached.menu { + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Inverted */ + +.ui.inverted.text.menu, +.ui.inverted.text.menu .item, +.ui.inverted.text.menu .item:hover, +.ui.inverted.text.menu .active.item { + background-color: transparent; +} + +/* Fluid */ + +.ui.fluid.text.menu { + margin-left: 0; + margin-right: 0; +} + +/*-------------- + Icon Only +---------------*/ + +/* Vertical Menu */ + +.ui.vertical.icon.menu { + display: inline-block; + width: auto; +} + +/* Item */ + +.ui.icon.menu .item { + height: auto; + text-align: center; + color: #1B1C1D; +} + +/* Icon */ + +.ui.icon.menu .item > i.icon:not(.dropdown) { + margin: 0; + opacity: 1; +} + +/* Icon Gylph */ + +.ui.icon.menu i.icon:before { + opacity: 1; +} + +/* (x) Item Icon */ + +.ui.menu .icon.item > i.icon { + width: auto; + margin: 0 auto; +} + +/* Vertical Icon */ + +.ui.vertical.icon.menu .item > i.icon:not(.dropdown) { + display: block; + opacity: 1; + margin: 0 auto; + float: none; +} + +/* Inverted */ + +.ui.inverted.icon.menu .item { + color: #FFFFFF; +} + +/*-------------- + Labeled Icon + ---------------*/ + +/* Menu */ + +.ui.labeled.icon.menu { + text-align: center; +} + +/* Item */ + +.ui.labeled.icon.menu .item { + min-width: 6em; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; +} + +/* Icon */ + +.ui.labeled.icon.menu > .item > i.icon:not(.dropdown) { + height: 1em; + display: block; + font-size: 1.75em !important; + margin: 0 auto 0.5rem !important; +} + +/* Fluid */ + +.ui.fluid.labeled.icon.menu > .item { + min-width: 0; +} + +/******************************* + Variations +*******************************/ + +/*-------------- + Stackable + ---------------*/ + +@media only screen and (max-width: 767.98px) { + .ui.stackable.menu { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } + + .ui.stackable.menu .item { + width: 100% !important; + } + + .ui.stackable.menu .item:before { + position: absolute; + content: ''; + top: auto; + bottom: 0; + left: 0; + width: 100%; + height: 1px; + background: rgba(34, 36, 38, 0.1); + } + + .ui.stackable.menu .left.menu, + .ui.stackable.menu .left.item { + margin-right: 0 !important; + } + + .ui.stackable.menu .right.menu, + .ui.stackable.menu .right.item { + margin-left: 0 !important; + } + + .ui.stackable.menu .center.menu, + .ui.stackable.menu .center.item { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .ui.stackable.menu .right.menu, + .ui.stackable.menu .center.menu, + .ui.stackable.menu .left.menu { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +/*-------------- + Colors +---------------*/ + +.ui.ui.ui.menu .primary.active.item, +.ui.ui.primary.menu .active.item:hover, +.ui.ui.primary.menu .active.item { + color: #6435C9; +} + +.ui.ui.ui.menu .red.active.item, +.ui.ui.red.menu .active.item:hover, +.ui.ui.red.menu .active.item { + color: #DB2828; +} + +.ui.ui.ui.menu .orange.active.item, +.ui.ui.orange.menu .active.item:hover, +.ui.ui.orange.menu .active.item { + color: #F2711C; +} + +.ui.ui.ui.menu .yellow.active.item, +.ui.ui.yellow.menu .active.item:hover, +.ui.ui.yellow.menu .active.item { + color: #FBBD08; +} + +.ui.ui.ui.menu .olive.active.item, +.ui.ui.olive.menu .active.item:hover, +.ui.ui.olive.menu .active.item { + color: #B5CC18; +} + +.ui.ui.ui.menu .green.active.item, +.ui.ui.green.menu .active.item:hover, +.ui.ui.green.menu .active.item { + color: #21BA45; +} + +.ui.ui.ui.menu .teal.active.item, +.ui.ui.teal.menu .active.item:hover, +.ui.ui.teal.menu .active.item { + color: #00B5AD; +} + +.ui.ui.ui.menu .blue.active.item, +.ui.ui.blue.menu .active.item:hover, +.ui.ui.blue.menu .active.item { + color: #2185D0; +} + +.ui.ui.ui.menu .violet.active.item, +.ui.ui.violet.menu .active.item:hover, +.ui.ui.violet.menu .active.item { + color: #6435C9; +} + +.ui.ui.ui.menu .purple.active.item, +.ui.ui.purple.menu .active.item:hover, +.ui.ui.purple.menu .active.item { + color: #A333C8; +} + +.ui.ui.ui.menu .pink.active.item, +.ui.ui.pink.menu .active.item:hover, +.ui.ui.pink.menu .active.item { + color: #E03997; +} + +.ui.ui.ui.menu .brown.active.item, +.ui.ui.brown.menu .active.item:hover, +.ui.ui.brown.menu .active.item { + color: #A5673F; +} + +.ui.ui.ui.menu .grey.active.item, +.ui.ui.grey.menu .active.item:hover, +.ui.ui.grey.menu .active.item { + color: #767676; +} + +.ui.ui.ui.menu .black.active.item, +.ui.ui.black.menu .active.item:hover, +.ui.ui.black.menu .active.item { + color: #1B1C1D; +} + +/*-------------- + Inverted + ---------------*/ + +.ui.inverted.menu { + border: 0 solid transparent; + background: #1B1C1D; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Menu Item */ + +.ui.inverted.menu .item, +.ui.inverted.menu .item > a:not(.ui) { + background: transparent; + color: rgba(255, 255, 255, 0.9); +} + +.ui.inverted.menu .item.menu { + background: transparent; +} + +/*--- Border ---*/ + +.ui.inverted.menu .item:before { + background: rgba(255, 255, 255, 0.08); +} + +.ui.vertical.inverted.menu .item:before { + background: rgba(255, 255, 255, 0.08); +} + +/* Sub Menu */ + +.ui.vertical.inverted.menu .menu .item, +.ui.vertical.inverted.menu .menu .item a:not(.ui) { + color: rgba(255, 255, 255, 0.5); +} + +/* Header */ + +.ui.inverted.menu .header.item { + margin: 0; + background: transparent; + -webkit-box-shadow: none; + box-shadow: none; +} + +/* Disabled */ + +.ui.ui.inverted.menu .item.disabled { + color: rgba(225, 225, 225, 0.3); +} + +/*--- Hover ---*/ + +.ui.link.inverted.menu .item:hover, +.ui.inverted.menu .dropdown.item:hover, +.ui.inverted.menu .link.item:hover, +.ui.inverted.menu a.item:hover { + background: rgba(255, 255, 255, 0.08); + color: #ffffff; +} + +.ui.vertical.inverted.menu .item .menu a.item:hover, +.ui.vertical.inverted.menu .item .menu .link.item:hover { + background: transparent; + color: #ffffff; +} + +/*--- Pressed ---*/ + +.ui.inverted.menu a.item:active, +.ui.inverted.menu .link.item:active { + background: rgba(255, 255, 255, 0.08); + color: #ffffff; +} + +/*--- Active ---*/ + +.ui.inverted.menu .active.item { + background: #3D3E3F; + color: #ffffff !important; +} + +.ui.inverted.vertical.menu .item .menu .active.item { + background: transparent; + color: #FFFFFF; +} + +.ui.inverted.pointing.menu .active.item:after { + background: #3D3E3F; + margin: 0 !important; + -webkit-box-shadow: none !important; + box-shadow: none !important; + border: none !important; +} + +/*--- Active Hover ---*/ + +.ui.inverted.menu .active.item:hover { + background: #3D3E3F; + color: #FFFFFF !important; +} + +.ui.inverted.pointing.menu .active.item:hover:after { + background: #3D3E3F; +} + +/*-------------- + Floated + ---------------*/ + +.ui.floated.menu { + float: left; + margin: 0 0.5rem 0 0; +} + +.ui.floated.menu .item:last-child:before { + display: none; +} + +.ui.right.floated.menu { + float: right; + margin: 0 0 0 0.5rem; +} + +/*-------------- + Inverted + ---------------*/ + +.ui.ui.ui.inverted.menu .primary.active.item, +.ui.ui.inverted.primary.menu { + background-color: #6435C9; +} + +.ui.inverted.primary.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.primary.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.primary.menu .active.item { + background-color: #5829bb; +} + +.ui.ui.ui.inverted.menu .red.active.item, +.ui.ui.inverted.red.menu { + background-color: #DB2828; +} + +.ui.inverted.red.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.red.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.red.menu .active.item { + background-color: #d01919; +} + +.ui.ui.ui.inverted.menu .orange.active.item, +.ui.ui.inverted.orange.menu { + background-color: #F2711C; +} + +.ui.inverted.orange.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.orange.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.orange.menu .active.item { + background-color: #f26202; +} + +.ui.ui.ui.inverted.menu .yellow.active.item, +.ui.ui.inverted.yellow.menu { + background-color: #FBBD08; +} + +.ui.inverted.yellow.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.yellow.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.yellow.menu .active.item { + background-color: #eaae00; +} + +.ui.ui.ui.inverted.menu .olive.active.item, +.ui.ui.inverted.olive.menu { + background-color: #B5CC18; +} + +.ui.inverted.olive.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.olive.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.olive.menu .active.item { + background-color: #a7bd0d; +} + +.ui.ui.ui.inverted.menu .green.active.item, +.ui.ui.inverted.green.menu { + background-color: #21BA45; +} + +.ui.inverted.green.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.green.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.green.menu .active.item { + background-color: #16ab39; +} + +.ui.ui.ui.inverted.menu .teal.active.item, +.ui.ui.inverted.teal.menu { + background-color: #00B5AD; +} + +.ui.inverted.teal.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.teal.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.teal.menu .active.item { + background-color: #009c95; +} + +.ui.ui.ui.inverted.menu .blue.active.item, +.ui.ui.inverted.blue.menu { + background-color: #2185D0; +} + +.ui.inverted.blue.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.blue.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.blue.menu .active.item { + background-color: #1678c2; +} + +.ui.ui.ui.inverted.menu .violet.active.item, +.ui.ui.inverted.violet.menu { + background-color: #6435C9; +} + +.ui.inverted.violet.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.violet.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.violet.menu .active.item { + background-color: #5829bb; +} + +.ui.ui.ui.inverted.menu .purple.active.item, +.ui.ui.inverted.purple.menu { + background-color: #A333C8; +} + +.ui.inverted.purple.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.purple.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.purple.menu .active.item { + background-color: #9627ba; +} + +.ui.ui.ui.inverted.menu .pink.active.item, +.ui.ui.inverted.pink.menu { + background-color: #E03997; +} + +.ui.inverted.pink.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.pink.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.pink.menu .active.item { + background-color: #e61a8d; +} + +.ui.ui.ui.inverted.menu .brown.active.item, +.ui.ui.inverted.brown.menu { + background-color: #A5673F; +} + +.ui.inverted.brown.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.brown.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.brown.menu .active.item { + background-color: #975b33; +} + +.ui.ui.ui.inverted.menu .grey.active.item, +.ui.ui.inverted.grey.menu { + background-color: #767676; +} + +.ui.inverted.grey.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.grey.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.grey.menu .active.item { + background-color: #838383; +} + +.ui.ui.ui.inverted.menu .black.active.item, +.ui.ui.inverted.black.menu { + background-color: #1B1C1D; +} + +.ui.inverted.black.menu .item:before { + background-color: rgba(34, 36, 38, 0.1); +} + +.ui.ui.inverted.black.menu .active.item { + background-color: rgba(0, 0, 0, 0.1); +} + +.ui.inverted.pointing.black.menu .active.item { + background-color: #27292a; +} + +.ui.ui.ui.inverted.pointing.menu .active.item:after { + background-color: inherit; +} + +/*-------------- + Fitted + ---------------*/ + +.ui.fitted.menu .item, +.ui.fitted.menu .item .menu .item, +.ui.menu .fitted.item { + padding: 0; +} + +.ui.horizontally.fitted.menu .item, +.ui.horizontally.fitted.menu .item .menu .item, +.ui.menu .horizontally.fitted.item { + padding-top: 0.91666667em; + padding-bottom: 0.91666667em; +} + +.ui.vertically.fitted.menu .item, +.ui.vertically.fitted.menu .item .menu .item, +.ui.menu .vertically.fitted.item { + padding-left: 1.16666667em; + padding-right: 1.16666667em; +} + +/*-------------- + Borderless + ---------------*/ + +.ui.borderless.menu .item:before, +.ui.borderless.menu .item .menu .item:before, +.ui.menu .borderless.item:before { + background: none !important; +} + +/*------------------- + Compact + --------------------*/ + +.ui.compact.menu { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + margin: 0; + vertical-align: middle; +} + +.ui.compact.vertical.menu { + /* IE hack to make dropdown icons appear inline */ + display: -ms-inline-flexbox !important; + display: inline-block; +} + +.ui.compact.menu:not(.secondary) .item:last-child { + border-radius: 0 0.33333333rem 0.33333333rem 0; +} + +.ui.compact.menu .item:last-child:before { + display: none; +} + +.ui.compact.vertical.menu { + width: auto !important; +} + +.ui.compact.vertical.menu .item:last-child::before { + display: block; +} + +/*------------------- + Fluid + --------------------*/ + +.ui.menu.fluid, +.ui.vertical.menu.fluid { + width: 100% !important; +} + +/*------------------- + Evenly Sized +--------------------*/ + +.ui.item.menu, +.ui.item.menu .item { + width: 100%; + padding-left: 0 !important; + padding-right: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + text-align: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; +} + +.ui.attached.item.menu:not(.tabular) { + margin: 0 -1px !important; +} + +.ui.item.menu .item:last-child:before { + display: none; +} + +.ui.menu.two.item .item { + width: 50%; +} + +.ui.menu.three.item .item { + width: 33.333%; +} + +.ui.menu.four.item .item { + width: 25%; +} + +.ui.menu.five.item .item { + width: 20%; +} + +.ui.menu.six.item .item { + width: 16.666%; +} + +.ui.menu.seven.item .item { + width: 14.285%; +} + +.ui.menu.eight.item .item { + width: 12.5%; +} + +.ui.menu.nine.item .item { + width: 11.11%; +} + +.ui.menu.ten.item .item { + width: 10%; +} + +.ui.menu.eleven.item .item { + width: 9.09%; +} + +.ui.menu.twelve.item .item { + width: 8.333%; +} + +/*-------------- + Fixed + ---------------*/ + +.ui.menu.fixed { + position: fixed; + z-index: 101; + margin: 0; + width: 100%; +} + +.ui.menu.fixed, +.ui.menu.fixed .item:first-child, +.ui.menu.fixed .item:last-child { + border-radius: 0 !important; +} + +.ui.fixed.menu, +.ui[class*="top fixed"].menu { + top: 0; + left: 0; + right: auto; + bottom: auto; +} + +.ui[class*="top fixed"].menu { + border-top: none; + border-left: none; + border-right: none; +} + +.ui[class*="right fixed"].menu { + border-top: none; + border-bottom: none; + border-right: none; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: auto; + height: 100%; +} + +.ui[class*="bottom fixed"].menu { + border-bottom: none; + border-left: none; + border-right: none; + bottom: 0; + left: 0; + top: auto; + right: auto; +} + +.ui[class*="left fixed"].menu { + border-top: none; + border-bottom: none; + border-left: none; + top: 0; + left: 0; + right: auto; + bottom: auto; + width: auto; + height: 100%; +} + +/* Coupling with Grid */ + +.ui.fixed.menu + .ui.grid { + padding-top: 2.75rem; +} + +/*------------------- + Pointing + --------------------*/ + +.ui.pointing.menu .item:after { + visibility: hidden; + position: absolute; + content: ''; + top: 100%; + left: 50%; + -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); + transform: translateX(-50%) translateY(-50%) rotate(45deg); + background: none; + margin: 0.5px 0 0; + width: 0.66666667em; + height: 0.66666667em; + border: none; + border-bottom: 1px solid #D4D4D5; + border-right: 1px solid #D4D4D5; + z-index: 2; + -webkit-transition: background 0.1s ease; + transition: background 0.1s ease; +} + +.ui.vertical.pointing.menu .item:after { + position: absolute; + top: 50%; + right: 0; + bottom: auto; + left: auto; + -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg); + transform: translateX(50%) translateY(-50%) rotate(45deg); + margin: 0 -0.5px 0 0; + border: none; + border-top: 1px solid #D4D4D5; + border-right: 1px solid #D4D4D5; +} + +@media only screen and (max-width: 767.98px) { + .stackable .ui.vertical.pointing.menu .item::after { + display: none; + } +} + +.ui.pointing.menu .ui.dropdown .menu .item:after, +.ui.vertical.pointing.menu .ui.dropdown .menu .item:after { + display: none; +} + +/* Active */ + +.ui.pointing.menu .active.item:after { + visibility: visible; +} + +.ui.pointing.menu .active.dropdown.item:after { + visibility: hidden; +} + +/* Don't double up pointers */ + +.ui.pointing.menu .dropdown.active.item:after, +.ui.pointing.menu .active.item .menu .active.item:after { + display: none; +} + +/* Colors */ + +.ui.pointing.menu .active.item:hover:after { + background-color: #F2F2F2; +} + +.ui.pointing.menu .active.item:after { + background-color: #F2F2F2; +} + +.ui.pointing.menu .active.item:hover:after { + background-color: #F2F2F2; +} + +.ui.vertical.pointing.menu .active.item:hover:after { + background-color: #F2F2F2; +} + +.ui.vertical.pointing.menu .active.item:after { + background-color: #F2F2F2; +} + +.ui.vertical.pointing.menu .menu .active.item:after { + background-color: #FFFFFF; +} + +.ui.inverted.pointing.menu .primary.active.item:after { + background-color: #6435C9; +} + +.ui.inverted.pointing.menu .secondary.active.item:after { + background-color: #1B1C1D; +} + +.ui.inverted.pointing.menu .red.active.item:after { + background-color: #DB2828; +} + +.ui.inverted.pointing.menu .orange.active.item:after { + background-color: #F2711C; +} + +.ui.inverted.pointing.menu .yellow.active.item:after { + background-color: #FBBD08; +} + +.ui.inverted.pointing.menu .olive.active.item:after { + background-color: #B5CC18; +} + +.ui.inverted.pointing.menu .green.active.item:after { + background-color: #21BA45; +} + +.ui.inverted.pointing.menu .teal.active.item:after { + background-color: #00B5AD; +} + +.ui.inverted.pointing.menu .blue.active.item:after { + background-color: #2185D0; +} + +.ui.inverted.pointing.menu .violet.active.item:after { + background-color: #6435C9; +} + +.ui.inverted.pointing.menu .purple.active.item:after { + background-color: #A333C8; +} + +.ui.inverted.pointing.menu .pink.active.item:after { + background-color: #E03997; +} + +.ui.inverted.pointing.menu .brown.active.item:after { + background-color: #A5673F; +} + +.ui.inverted.pointing.menu .grey.active.item:after { + background-color: #767676; +} + +.ui.inverted.pointing.menu .black.active.item:after { + background-color: #1B1C1D; +} + +/*-------------- + Attached + ---------------*/ + +/* Middle */ + +.ui.attached.menu { + top: 0; + bottom: 0; + border-radius: 0; + margin: 0 -1px; + width: calc(100% + 2px); + max-width: calc(100% + 2px); + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.attached + .ui.attached.menu:not(.top) { + border-top: none; +} + +/* Top */ + +.ui[class*="top attached"].menu { + bottom: 0; + margin-bottom: 0; + top: 0; + margin-top: 1rem; + border-radius: 0.33333333rem 0.33333333rem 0 0; +} + +.ui.menu[class*="top attached"]:first-child { + margin-top: 0; +} + +/* Bottom */ + +.ui[class*="bottom attached"].menu { + bottom: 0; + margin-top: 0; + top: 0; + margin-bottom: 1rem; + -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; + box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; + border-radius: 0 0 0.33333333rem 0.33333333rem; +} + +.ui[class*="bottom attached"].menu:last-child { + margin-bottom: 0; +} + +/* Attached Menu Item */ + +.ui.top.attached.menu > .item:first-child { + border-radius: 0.33333333rem 0 0 0; +} + +.ui.bottom.attached.menu > .item:first-child { + border-radius: 0 0 0 0.33333333rem; +} + +/* Tabular Attached */ + +.ui.attached.menu:not(.tabular) { + border: 1px solid #D4D4D5; +} + +.ui.attached.inverted.menu { + border: none; +} + +.ui.attached.tabular.menu { + margin-left: 0; + margin-right: 0; + width: 100%; +} + +/*-------------- + Sizes +---------------*/ + +.ui.menu { + font-size: 1rem; +} + +.ui.vertical.menu { + width: 15rem; +} + +.ui.mini.menu, +.ui.mini.menu .dropdown, +.ui.mini.menu .dropdown .menu > .item { + font-size: 0.91666667rem; +} + +.ui.mini.vertical.menu:not(.icon) { + width: 9rem; +} + +.ui.tiny.menu, +.ui.tiny.menu .dropdown, +.ui.tiny.menu .dropdown .menu > .item { + font-size: 1rem; +} + +.ui.tiny.vertical.menu:not(.icon) { + width: 11rem; +} + +.ui.small.menu, +.ui.small.menu .dropdown, +.ui.small.menu .dropdown .menu > .item { + font-size: 1.08333333rem; +} + +.ui.small.vertical.menu:not(.icon) { + width: 13rem; +} + +.ui.large.menu, +.ui.large.menu .dropdown, +.ui.large.menu .dropdown .menu > .item { + font-size: 1.25rem; +} + +.ui.large.vertical.menu:not(.icon) { + width: 18rem; +} + +.ui.big.menu, +.ui.big.menu .dropdown, +.ui.big.menu .dropdown .menu > .item { + font-size: 1.33333333rem; +} + +.ui.big.vertical.menu:not(.icon) { + width: 20rem; +} + +.ui.huge.menu, +.ui.huge.menu .dropdown, +.ui.huge.menu .dropdown .menu > .item { + font-size: 1.41666667rem; +} + +.ui.huge.vertical.menu:not(.icon) { + width: 22rem; +} + +.ui.massive.menu, +.ui.massive.menu .dropdown, +.ui.massive.menu .dropdown .menu > .item { + font-size: 1.5rem; +} + +.ui.massive.vertical.menu:not(.icon) { + width: 25rem; +} + +/*------------------- + Inverted dropdowns +--------------------*/ + +.ui.menu .ui.inverted.inverted.dropdown.item .menu { + background: #1B1C1D; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.menu .ui.inverted.dropdown .menu > .item { + color: rgba(255, 255, 255, 0.8) !important; +} + +.ui.menu .ui.inverted.dropdown .menu > .active.item { + background: transparent !important; + color: rgba(255, 255, 255, 0.8) !important; +} + +.ui.menu .ui.inverted.dropdown .menu > .item:hover { + background: rgba(255, 255, 255, 0.08) !important; + color: rgba(255, 255, 255, 0.8) !important; +} + +.ui.menu .ui.inverted.dropdown .menu > .selected.item { + background: rgba(255, 255, 255, 0.15) !important; + color: rgba(255, 255, 255, 0.8) !important; +} + +/* Vertical */ + +.ui.vertical.menu .inverted.dropdown.item .menu { + -webkit-box-shadow: none; + box-shadow: none; +} + +/******************************* + Theme Overrides +*******************************/ + +/******************************* + Site Overrides +*******************************/ +/*! + * # Fomantic-UI 2.8.8 - Message + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Message +*******************************/ + +.ui.message { + position: relative; + min-height: 1em; + margin: 1em 0; + background: #F8F8F9; + padding: 1em 1.5em; + line-height: 1.4285em; + color: rgba(0, 0, 0, 0.87); + -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease; + transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease; + border-radius: 0.33333333rem; + -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.message:first-child { + margin-top: 0; +} + +.ui.message:last-child { + margin-bottom: 0; +} + +/*-------------- + Content +---------------*/ + +/* Header */ + +.ui.message .header { + display: block; + font-family: 'Raleway', sans-serif; + font-weight: bold; + margin: -0.14285714em 0 0 0; +} + +/* Default font size */ + +.ui.message .header:not(.ui) { + font-size: 1.16666667em; +} + +/* Paragraph */ + +.ui.message p { + opacity: 0.85; + margin: 0.75em 0; +} + +.ui.message p:first-child { + margin-top: 0; +} + +.ui.message p:last-child { + margin-bottom: 0; +} + +.ui.message .header + p { + margin-top: 0.25em; +} + +/* List */ + +.ui.message .list:not(.ui) { + text-align: left; + padding: 0; + opacity: 0.85; + list-style-position: inside; + margin: 0.5em 0 0; +} + +.ui.message .list:not(.ui):first-child { + margin-top: 0; +} + +.ui.message .list:not(.ui):last-child { + margin-bottom: 0; +} + +.ui.message .list:not(.ui) li { + position: relative; + list-style-type: none; + margin: 0 0 0.3em 1em; + padding: 0; +} + +.ui.message .list:not(.ui) li:before { + position: absolute; + content: '•'; + left: -1em; + height: 100%; + vertical-align: baseline; +} + +.ui.message .list:not(.ui) li:last-child { + margin-bottom: 0; +} + +/* Icon */ + +.ui.icon.message > .icons, +.ui.icon.message > i.icon { + margin-right: 0.6em; +} + +.ui.icon.message > .icons:last-child, +.ui.icon.message > i.icon:last-child { + margin: 0 0 0 0.6em; +} + +/* Close Icon */ + +.ui.message > .close.icon { + cursor: pointer; + position: absolute; + margin: 0; + top: 0.78575em; + right: 0.5em; + opacity: 0.7; + -webkit-transition: opacity 0.1s ease; + transition: opacity 0.1s ease; +} + +.ui.message > .close.icon:hover { + opacity: 1; +} + +/* First / Last Element */ + +.ui.message > :first-child { + margin-top: 0; +} + +.ui.message > :last-child { + margin-bottom: 0; +} + +/******************************* + Coupling +*******************************/ + +.ui.dropdown .menu > .message { + margin: 0 -1px; +} + +/******************************* + States +*******************************/ + +/*-------------- + Visible +---------------*/ + +.ui.visible.visible.visible.visible.message { + display: block; +} + +.ui.icon.visible.visible.visible.visible.message { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +/*-------------- + Hidden +---------------*/ + +.ui.hidden.hidden.hidden.hidden.message { + display: none; +} + +/******************************* + Variations +*******************************/ + +.ui.centered.message, +.ui.center.aligned.message { + text-align: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; +} + +.ui.centered.message > .content, +.ui.center.aligned.message > .content { + -webkit-box-flex: 0; + -ms-flex: 0 0 auto; + flex: 0 0 auto; +} + +.ui.right.aligned.message { + text-align: right; +} + +/*-------------- + Compact + ---------------*/ + +.ui.compact.message { + display: inline-block; +} + +.ui.compact.icon.message { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + width: auto; +} + +/*-------------- + Attached + ---------------*/ + +.ui.attached.message { + margin-bottom: -1px; + border-radius: 0.33333333rem 0.33333333rem 0 0; + -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; + box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; + margin-left: -1px; + margin-right: -1px; +} + +.ui.attached + .ui.attached.message:not(.top):not(.bottom) { + margin-top: -1px; + border-radius: 0; +} + +.ui.bottom.attached.message { + margin-top: -1px; + border-radius: 0 0 0.33333333rem 0.33333333rem; + -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15); +} + +.ui.bottom.attached.message:not(:last-child) { + margin-bottom: 1em; +} + +.ui.attached.icon.message { + width: auto; +} + +/*-------------- + Icon + ---------------*/ + +.ui.icon.message { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + width: 100%; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; +} + +.ui.icon.message > .icons, +.ui.icon.message > i.icon:not(.close) { + display: block; + -webkit-box-flex: 0; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + width: auto; + line-height: 1; + vertical-align: middle; + font-size: 3em; + opacity: 0.8; +} + +.ui.icon.message > .content { + display: block; + -webkit-box-flex: 1; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + vertical-align: middle; +} + +.ui.icon.message > .icons + .content, +.ui.icon.message > i.icon:not(.close) + .content { + padding-left: 0; +} + +.ui.icon.message > i.circular { + width: 1em; +} + +/*-------------- + Floating + ---------------*/ + +.ui.floating.message { + -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +/*-------------- + Colors +---------------*/ + +/*-------------- + Types +---------------*/ + +.ui.positive.message { + background-color: #FCFFF5; + color: #2C662D; +} + +.ui.positive.message, +.ui.attached.positive.message { + -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.positive.message { + -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.positive.message .header { + color: #1A531B; +} + +.ui.inverted.positive.message, +.ui.inverted.positive.message .header { + color: #A3C293; +} + +.ui.negative.message { + background-color: #FFF6F6; + color: #9F3A38; +} + +.ui.negative.message, +.ui.attached.negative.message { + -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.negative.message { + -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.negative.message .header { + color: #912D2B; +} + +.ui.inverted.negative.message, +.ui.inverted.negative.message .header { + color: #E0B4B4; +} + +.ui.info.message { + background-color: #F8FFFF; + color: #276F86; +} + +.ui.info.message, +.ui.attached.info.message { + -webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.info.message { + -webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.info.message .header { + color: #0E566C; +} + +.ui.inverted.info.message, +.ui.inverted.info.message .header { + color: #c6e3e9; +} + +.ui.warning.message { + background-color: #FFFAF3; + color: #573A08; +} + +.ui.warning.message, +.ui.attached.warning.message { + -webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.warning.message { + -webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.warning.message .header { + color: #794B02; +} + +.ui.inverted.warning.message, +.ui.inverted.warning.message .header { + color: #d7ccb5; +} + +.ui.error.message { + background-color: #FFF6F6; + color: #9F3A38; +} + +.ui.error.message, +.ui.attached.error.message { + -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.error.message { + -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.error.message .header { + color: #912D2B; +} + +.ui.inverted.error.message, +.ui.inverted.error.message .header { + color: #ecd1d1; +} + +.ui.success.message { + background-color: #FCFFF5; + color: #2C662D; +} + +.ui.success.message, +.ui.attached.success.message { + -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.success.message { + -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.success.message .header { + color: #1A531B; +} + +.ui.inverted.success.message, +.ui.inverted.success.message .header { + color: #b9d1ad; +} + +.ui.primary.message { + background-color: #DFF0FF; + color: rgba(255, 255, 255, 0.9); +} + +.ui.primary.message, +.ui.attached.primary.message { + -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.primary.message { + -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.primary.message .header { + color: rgba(242, 242, 242, 0.9); +} + +.ui.secondary.message { + background-color: #F4F4F4; + color: rgba(255, 255, 255, 0.9); +} + +.ui.secondary.message, +.ui.attached.secondary.message { + -webkit-box-shadow: 0 0 0 1px #1B1C1D inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #1B1C1D inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.secondary.message { + -webkit-box-shadow: 0 0 0 1px #1B1C1D inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #1B1C1D inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.secondary.message .header { + color: rgba(242, 242, 242, 0.9); +} + +.ui.red.message { + background-color: #FFE8E6; + color: #DB2828; +} + +.ui.red.message, +.ui.attached.red.message { + -webkit-box-shadow: 0 0 0 1px #DB2828 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #DB2828 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.red.message { + -webkit-box-shadow: 0 0 0 1px #DB2828 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #DB2828 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.red.message .header { + color: #c82121; +} + +.ui.orange.message { + background-color: #FFEDDE; + color: #F2711C; +} + +.ui.orange.message, +.ui.attached.orange.message { + -webkit-box-shadow: 0 0 0 1px #F2711C inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #F2711C inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.orange.message { + -webkit-box-shadow: 0 0 0 1px #F2711C inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #F2711C inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.orange.message .header { + color: #e7640d; +} + +.ui.yellow.message { + background-color: #FFF8DB; + color: #B58105; +} + +.ui.yellow.message, +.ui.attached.yellow.message { + -webkit-box-shadow: 0 0 0 1px #B58105 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #B58105 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.yellow.message { + -webkit-box-shadow: 0 0 0 1px #B58105 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #B58105 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.yellow.message .header { + color: #9c6f04; +} + +.ui.olive.message { + background-color: #FBFDEF; + color: #8ABC1E; +} + +.ui.olive.message, +.ui.attached.olive.message { + -webkit-box-shadow: 0 0 0 1px #8ABC1E inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #8ABC1E inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.olive.message { + -webkit-box-shadow: 0 0 0 1px #8ABC1E inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #8ABC1E inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.olive.message .header { + color: #7aa61a; +} + +.ui.green.message { + background-color: #E5F9E7; + color: #1EBC30; +} + +.ui.green.message, +.ui.attached.green.message { + -webkit-box-shadow: 0 0 0 1px #1EBC30 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #1EBC30 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.green.message { + -webkit-box-shadow: 0 0 0 1px #1EBC30 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #1EBC30 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.green.message .header { + color: #1aa62a; +} + +.ui.teal.message { + background-color: #E1F7F7; + color: #10A3A3; +} + +.ui.teal.message, +.ui.attached.teal.message { + -webkit-box-shadow: 0 0 0 1px #10A3A3 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #10A3A3 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.teal.message { + -webkit-box-shadow: 0 0 0 1px #10A3A3 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #10A3A3 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.teal.message .header { + color: #0e8c8c; +} + +.ui.blue.message { + background-color: #DFF0FF; + color: #2185D0; +} + +.ui.blue.message, +.ui.attached.blue.message { + -webkit-box-shadow: 0 0 0 1px #2185D0 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #2185D0 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.blue.message { + -webkit-box-shadow: 0 0 0 1px #2185D0 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #2185D0 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.blue.message .header { + color: #1e77ba; +} + +.ui.violet.message { + background-color: #EAE7FF; + color: #6435C9; +} + +.ui.violet.message, +.ui.attached.violet.message { + -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.violet.message { + -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.violet.message .header { + color: #5a30b5; +} + +.ui.purple.message { + background-color: #F6E7FF; + color: #A333C8; +} + +.ui.purple.message, +.ui.attached.purple.message { + -webkit-box-shadow: 0 0 0 1px #A333C8 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #A333C8 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.purple.message { + -webkit-box-shadow: 0 0 0 1px #A333C8 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #A333C8 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.purple.message .header { + color: #922eb4; +} + +.ui.pink.message { + background-color: #FFE3FB; + color: #E03997; +} + +.ui.pink.message, +.ui.attached.pink.message { + -webkit-box-shadow: 0 0 0 1px #E03997 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #E03997 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.pink.message { + -webkit-box-shadow: 0 0 0 1px #E03997 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #E03997 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.pink.message .header { + color: #dd238b; +} + +.ui.brown.message { + background-color: #F1E2D3; + color: #A5673F; +} + +.ui.brown.message, +.ui.attached.brown.message { + -webkit-box-shadow: 0 0 0 1px #A5673F inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #A5673F inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.brown.message { + -webkit-box-shadow: 0 0 0 1px #A5673F inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #A5673F inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.brown.message .header { + color: #935b38; +} + +.ui.grey.message { + background-color: #F4F4F4; + color: #767676; +} + +.ui.grey.message, +.ui.attached.grey.message { + -webkit-box-shadow: 0 0 0 1px #767676 inset, 0 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 1px #767676 inset, 0 0 0 0 rgba(0, 0, 0, 0); +} + +.ui.floating.grey.message { + -webkit-box-shadow: 0 0 0 1px #767676 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 0 0 1px #767676 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.grey.message .header { + color: #696969; +} + +.ui.black.message { + background-color: #1B1C1D; + color: rgba(255, 255, 255, 0.9); +} + +.ui.black.message .header { + color: rgba(255, 255, 255, 0.9); +} + +.ui.inverted.message { + background-color: #1B1C1D; + color: rgba(255, 255, 255, 0.9); +} + +/*-------------- + Sizes +---------------*/ + +.ui.message { + font-size: 1em; +} + +.ui.mini.message { + font-size: 0.75em; +} + +.ui.tiny.message { + font-size: 0.83333333em; +} + +.ui.small.message { + font-size: 0.91666667em; +} + +.ui.large.message { + font-size: 1.16666667em; +} + +.ui.big.message { + font-size: 1.25em; +} + +.ui.huge.message { + font-size: 1.41666667em; +} + +.ui.massive.message { + font-size: 1.75em; +} + +/******************************* + Theme Overrides +*******************************/ + +/******************************* + Site Overrides +*******************************/ /*! * # Fomantic-UI 2.8.8 - Modal * http://github.com/fomantic/Fomantic-UI/ @@ -29467,6 +35001,918 @@ ol.ui.suffixed.list li:before, /******************************* Site Overrides *******************************/ +/*! + * # Fomantic-UI 2.8.8 - Popup + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Popup +*******************************/ + +.ui.popup { + display: none; + position: absolute; + top: 0; + right: 0; + /* Fixes content being squished when inline (moz only) */ + min-width: -webkit-min-content; + min-width: -moz-min-content; + min-width: min-content; + z-index: 1900; + border: 1px solid #D4D4D5; + line-height: 1.4285em; + max-width: 250px; + background: #FFFFFF; + padding: 0.833em 1em; + font-weight: normal; + font-style: normal; + color: rgba(0, 0, 0, 0.87); + border-radius: 0.33333333rem; + -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); +} + +.ui.popup > .header { + padding: 0; + font-family: 'Raleway', sans-serif; + font-size: 1.16666667em; + line-height: 1.2; + font-weight: bold; +} + +.ui.popup > .header + .content { + padding-top: 0.58333333em; +} + +.ui.popup:before { + position: absolute; + content: ''; + width: 0.83333333em; + height: 0.83333333em; + background: #FFFFFF; + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + z-index: 1901; + -webkit-box-shadow: 1px 1px 0 0 #bababc; + box-shadow: 1px 1px 0 0 #bababc; +} + +/******************************* + Types +*******************************/ + +/*-------------- + Tooltip + ---------------*/ + +/* Content */ + +[data-tooltip] { + position: relative; +} + +/* Arrow */ + +[data-tooltip]:before { + pointer-events: none; + position: absolute; + content: ''; + font-size: 1rem; + width: 0.83333333em; + height: 0.83333333em; + background: #FFFFFF; + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + z-index: 1901; + -webkit-box-shadow: 1px 1px 0 0 #bababc; + box-shadow: 1px 1px 0 0 #bababc; +} + +/* Popup */ + +[data-tooltip]:after { + pointer-events: none; + content: attr(data-tooltip); + position: absolute; + text-transform: none; + text-align: left; + text-shadow: none; + white-space: nowrap; + font-size: 1rem; + border: 1px solid #D4D4D5; + line-height: 1.4285em; + max-width: none; + background: #FFFFFF; + padding: 0.833em 1em; + font-weight: normal; + font-style: normal; + color: rgba(0, 0, 0, 0.87); + border-radius: 0.33333333rem; + -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); + z-index: 1900; +} + +/* Default Position (Top Center) */ + +[data-tooltip]:not([data-position]):before { + top: auto; + right: auto; + bottom: 100%; + left: 50%; + background: #FFFFFF; + margin-left: -0.08333333rem; + margin-bottom: 0.16666667rem; +} + +[data-tooltip]:not([data-position]):after { + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + bottom: 100%; + margin-bottom: 0.58333333em; +} + +/* Animation */ + +[data-tooltip]:before, +[data-tooltip]:after { + pointer-events: none; + visibility: hidden; + opacity: 0; + -webkit-transition: opacity 0.1s ease, -webkit-transform 0.1s ease; + transition: opacity 0.1s ease, -webkit-transform 0.1s ease; + transition: transform 0.1s ease, opacity 0.1s ease; + transition: transform 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease; +} + +[data-tooltip]:before { + -webkit-transform: rotate(45deg) scale(0) !important; + transform: rotate(45deg) scale(0) !important; + -webkit-transform-origin: center top; + transform-origin: center top; +} + +[data-tooltip]:after { + -webkit-transform-origin: center bottom; + transform-origin: center bottom; +} + +[data-tooltip]:hover:before, +[data-tooltip]:hover:after { + visibility: visible; + pointer-events: auto; + opacity: 1; +} + +[data-tooltip]:hover:before { + -webkit-transform: rotate(45deg) scale(1) !important; + transform: rotate(45deg) scale(1) !important; +} + +/* Animation Position */ + +[data-tooltip]:after, +[data-tooltip][data-position="top center"]:after, +[data-tooltip][data-position="bottom center"]:after { + -webkit-transform: translateX(-50%) scale(0) !important; + transform: translateX(-50%) scale(0) !important; +} + +[data-tooltip]:hover:after, +[data-tooltip][data-position="bottom center"]:hover:after { + -webkit-transform: translateX(-50%) scale(1) !important; + transform: translateX(-50%) scale(1) !important; +} + +[data-tooltip][data-position="left center"]:after, +[data-tooltip][data-position="right center"]:after { + -webkit-transform: translateY(-50%) scale(0) !important; + transform: translateY(-50%) scale(0) !important; +} + +[data-tooltip][data-position="left center"]:hover:after, +[data-tooltip][data-position="right center"]:hover:after { + -webkit-transform: translateY(-50%) scale(1) !important; + transform: translateY(-50%) scale(1) !important; + -moz-transform: translateY(-50%) scale(1.0001) !important; +} + +[data-tooltip][data-position="top left"]:after, +[data-tooltip][data-position="top right"]:after, +[data-tooltip][data-position="bottom left"]:after, +[data-tooltip][data-position="bottom right"]:after { + -webkit-transform: scale(0) !important; + transform: scale(0) !important; +} + +[data-tooltip][data-position="top left"]:hover:after, +[data-tooltip][data-position="top right"]:hover:after, +[data-tooltip][data-position="bottom left"]:hover:after, +[data-tooltip][data-position="bottom right"]:hover:after { + -webkit-transform: scale(1) !important; + transform: scale(1) !important; +} + +[data-tooltip][data-variation~="fixed"]:after { + white-space: normal; + width: 250px; +} + +[data-tooltip][data-variation*="wide fixed"]:after { + width: 350px; +} + +[data-tooltip][data-variation*="very wide fixed"]:after { + width: 550px; +} + +@media only screen and (max-width: 767.98px) { + [data-tooltip][data-variation~="fixed"]:after { + width: 250px; + } +} + +/*-------------- + Inverted + ---------------*/ + +/* Arrow */ + +[data-tooltip][data-inverted]:before { + -webkit-box-shadow: none !important; + box-shadow: none !important; +} + +/* Arrow Position */ + +[data-tooltip][data-inverted]:before { + background: #1B1C1D; +} + +/* Popup */ + +[data-tooltip][data-inverted]:after { + background: #1B1C1D; + color: #FFFFFF; + border: none; + -webkit-box-shadow: none; + box-shadow: none; +} + +[data-tooltip][data-inverted]:after .header { + background: none; + color: #FFFFFF; +} + +/*-------------- + Position + ---------------*/ + +[data-position~="top"][data-tooltip]:before { + background: #FFFFFF; +} + +/* Top Center */ + +[data-position="top center"][data-tooltip]:after { + top: auto; + right: auto; + left: 50%; + bottom: 100%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-bottom: 0.58333333em; +} + +[data-position="top center"][data-tooltip]:before { + top: auto; + right: auto; + bottom: 100%; + left: 50%; + background: #FFFFFF; + margin-left: -0.08333333rem; + margin-bottom: 0.16666667rem; +} + +/* Top Left */ + +[data-position="top left"][data-tooltip]:after { + top: auto; + right: auto; + left: 0; + bottom: 100%; + margin-bottom: 0.58333333em; +} + +[data-position="top left"][data-tooltip]:before { + top: auto; + right: auto; + bottom: 100%; + left: 1em; + margin-left: -0.08333333rem; + margin-bottom: 0.16666667rem; +} + +/* Top Right */ + +[data-position="top right"][data-tooltip]:after { + top: auto; + left: auto; + right: 0; + bottom: 100%; + margin-bottom: 0.58333333em; +} + +[data-position="top right"][data-tooltip]:before { + top: auto; + left: auto; + bottom: 100%; + right: 1em; + margin-left: -0.08333333rem; + margin-bottom: 0.16666667rem; +} + +[data-position~="bottom"][data-tooltip]:before { + background: #FFFFFF; + -webkit-box-shadow: -1px -1px 0 0 #bababc; + box-shadow: -1px -1px 0 0 #bababc; +} + +/* Bottom Center */ + +[data-position="bottom center"][data-tooltip]:after { + bottom: auto; + right: auto; + left: 50%; + top: 100%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: 0.58333333em; +} + +[data-position="bottom center"][data-tooltip]:before { + bottom: auto; + right: auto; + top: 100%; + left: 50%; + margin-left: -0.08333333rem; + margin-top: 0.36666667em; + -webkit-transform-origin: center top; + transform-origin: center top; +} + +/* Bottom Left */ + +[data-position="bottom left"][data-tooltip]:after { + left: 0; + top: 100%; + margin-top: 0.58333333em; +} + +[data-position="bottom left"][data-tooltip]:before { + bottom: auto; + right: auto; + top: 100%; + left: 1em; + margin-left: -0.08333333rem; + margin-top: 0.16666667rem; +} + +/* Bottom Right */ + +[data-position="bottom right"][data-tooltip]:after { + right: 0; + top: 100%; + margin-top: 0.58333333em; +} + +[data-position="bottom right"][data-tooltip]:before { + bottom: auto; + left: auto; + top: 100%; + right: 1em; + margin-left: -0.16666667rem; + margin-top: 0.08333333rem; +} + +/* Left Center */ + +[data-position="left center"][data-tooltip]:after { + right: 100%; + top: 50%; + margin-right: 0.58333333em; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); +} + +[data-position="left center"][data-tooltip]:before { + right: 100%; + top: 50%; + margin-top: -0.16666667rem; + margin-right: -0.08333333rem; + background: #FFFFFF; + -webkit-box-shadow: 1px -1px 0 0 #bababc; + box-shadow: 1px -1px 0 0 #bababc; +} + +/* Right Center */ + +[data-position="right center"][data-tooltip]:after { + left: 100%; + top: 50%; + margin-left: 0.58333333em; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); +} + +[data-position="right center"][data-tooltip]:before { + left: 100%; + top: 50%; + margin-top: -0.08333333rem; + margin-left: 0.16666667rem; + background: #FFFFFF; + -webkit-box-shadow: -1px 1px 0 0 #bababc; + box-shadow: -1px 1px 0 0 #bababc; +} + +/* Inverted Arrow Color */ + +[data-inverted][data-position~="bottom"][data-tooltip]:before { + background: #1B1C1D; + -webkit-box-shadow: -1px -1px 0 0 #bababc; + box-shadow: -1px -1px 0 0 #bababc; +} + +[data-inverted][data-position="left center"][data-tooltip]:before { + background: #1B1C1D; + -webkit-box-shadow: 1px -1px 0 0 #bababc; + box-shadow: 1px -1px 0 0 #bababc; +} + +[data-inverted][data-position="right center"][data-tooltip]:before { + background: #1B1C1D; + -webkit-box-shadow: -1px 1px 0 0 #bababc; + box-shadow: -1px 1px 0 0 #bababc; +} + +[data-inverted][data-position~="top"][data-tooltip]:before { + background: #1B1C1D; +} + +[data-position~="bottom"][data-tooltip]:before { + -webkit-transform-origin: center bottom; + transform-origin: center bottom; +} + +[data-position~="bottom"][data-tooltip]:after { + -webkit-transform-origin: center top; + transform-origin: center top; +} + +[data-position="left center"][data-tooltip]:before { + -webkit-transform-origin: top center; + transform-origin: top center; +} + +[data-position="left center"][data-tooltip]:after { + -webkit-transform-origin: right center; + transform-origin: right center; +} + +[data-position="right center"][data-tooltip]:before { + -webkit-transform-origin: right center; + transform-origin: right center; +} + +[data-position="right center"][data-tooltip]:after { + -webkit-transform-origin: left center; + transform-origin: left center; +} + +/*-------------- + Basic + ---------------*/ + +[data-tooltip][data-variation~="basic"]:before { + display: none; +} + +/*-------------- + Spacing +---------------*/ + +.ui.popup { + margin: 0; +} + +/* Extending from Top */ + +.ui.top.popup { + margin: 0 0 0.83333333em; +} + +.ui.top.left.popup { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; +} + +.ui.top.center.popup { + -webkit-transform-origin: center bottom; + transform-origin: center bottom; +} + +.ui.top.right.popup { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; +} + +/* Extending from Vertical Center */ + +.ui.left.center.popup { + margin: 0 0.83333333em 0 0; + -webkit-transform-origin: right 50%; + transform-origin: right 50%; +} + +.ui.right.center.popup { + margin: 0 0 0 0.83333333em; + -webkit-transform-origin: left 50%; + transform-origin: left 50%; +} + +/* Extending from Bottom */ + +.ui.bottom.popup { + margin: 0.83333333em 0 0; +} + +.ui.bottom.left.popup { + -webkit-transform-origin: left top; + transform-origin: left top; +} + +.ui.bottom.center.popup { + -webkit-transform-origin: center top; + transform-origin: center top; +} + +.ui.bottom.right.popup { + -webkit-transform-origin: right top; + transform-origin: right top; +} + +/*-------------- + Pointer + ---------------*/ + +/*--- Below ---*/ + +.ui.bottom.center.popup:before { + margin-left: -0.36666667em; + top: -0.36666667em; + left: 50%; + right: auto; + bottom: auto; + -webkit-box-shadow: -1px -1px 0 0 #bababc; + box-shadow: -1px -1px 0 0 #bababc; +} + +.ui.bottom.left.popup { + margin-left: 0; +} + +/*rtl:rename*/ + +.ui.bottom.left.popup:before { + top: -0.36666667em; + left: 1em; + right: auto; + bottom: auto; + margin-left: 0; + -webkit-box-shadow: -1px -1px 0 0 #bababc; + box-shadow: -1px -1px 0 0 #bababc; +} + +.ui.bottom.right.popup { + margin-right: 0; +} + +/*rtl:rename*/ + +.ui.bottom.right.popup:before { + top: -0.36666667em; + right: 1em; + bottom: auto; + left: auto; + margin-left: 0; + -webkit-box-shadow: -1px -1px 0 0 #bababc; + box-shadow: -1px -1px 0 0 #bababc; +} + +/*--- Above ---*/ + +.ui.top.center.popup:before { + top: auto; + right: auto; + bottom: -0.36666667em; + left: 50%; + margin-left: -0.36666667em; +} + +.ui.top.left.popup { + margin-left: 0; +} + +/*rtl:rename*/ + +.ui.top.left.popup:before { + bottom: -0.36666667em; + left: 1em; + top: auto; + right: auto; + margin-left: 0; +} + +.ui.top.right.popup { + margin-right: 0; +} + +/*rtl:rename*/ + +.ui.top.right.popup:before { + bottom: -0.36666667em; + right: 1em; + top: auto; + left: auto; + margin-left: 0; +} + +/*--- Left Center ---*/ + +/*rtl:rename*/ + +.ui.left.center.popup:before { + top: 50%; + right: -0.36666667em; + bottom: auto; + left: auto; + margin-top: -0.36666667em; + -webkit-box-shadow: 1px -1px 0 0 #bababc; + box-shadow: 1px -1px 0 0 #bababc; +} + +/*--- Right Center ---*/ + +/*rtl:rename*/ + +.ui.right.center.popup:before { + top: 50%; + left: -0.36666667em; + bottom: auto; + right: auto; + margin-top: -0.36666667em; + -webkit-box-shadow: -1px 1px 0 0 #bababc; + box-shadow: -1px 1px 0 0 #bababc; +} + +.ui.right.center.popup:before, +.ui.left.center.popup:before { + background: #FFFFFF; +} + +/* Arrow Color By Location */ + +.ui.bottom.popup:before { + background: #FFFFFF; +} + +.ui.top.popup:before { + background: #FFFFFF; +} + +/* Inverted Arrow Color */ + +.ui.inverted.bottom.popup:before { + background: #1B1C1D; +} + +.ui.inverted.right.center.popup:before, +.ui.inverted.left.center.popup:before { + background: #1B1C1D; +} + +.ui.inverted.top.popup:before { + background: #1B1C1D; +} + +/******************************* + Coupling +*******************************/ + +/* Immediate Nested Grid */ + +.ui.popup > .ui.grid:not(.padded) { + width: calc(100% + 1.75rem); + margin: -0.7rem -0.875rem; +} + +/******************************* + States +*******************************/ + +.ui.loading.popup { + display: block; + visibility: hidden; + z-index: -1; +} + +.ui.animating.popup, +.ui.visible.popup { + display: block; +} + +.ui.visible.popup { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-backface-visibility: hidden; + backface-visibility: hidden; +} + +/******************************* + Variations +*******************************/ + +/*-------------- + Basic + ---------------*/ + +.ui.basic.popup:before { + display: none; +} + +.ui.fixed.popup { + width: 250px; +} + +/*-------------- + Wide + ---------------*/ + +.ui.wide.popup { + max-width: 350px; +} + +.ui.wide.popup.fixed { + width: 350px; +} + +.ui[class*="very wide"].popup { + max-width: 550px; +} + +.ui[class*="very wide"].popup.fixed { + width: 550px; +} + +@media only screen and (max-width: 767.98px) { + .ui.wide.popup, + .ui[class*="very wide"].popup { + max-width: 250px; + } + + .ui.wide.popup.fixed, + .ui[class*="very wide"].popup.fixed { + width: 250px; + } +} + +/*-------------- + Fluid + ---------------*/ + +.ui.fluid.popup { + width: 100%; + max-width: none; +} + +/*-------------- + Colors + ---------------*/ + +/* Inverted colors */ + +.ui.inverted.popup { + background: #1B1C1D; + color: #FFFFFF; + border: none; + -webkit-box-shadow: none; + box-shadow: none; +} + +.ui.inverted.popup .header { + background-color: none; + color: #FFFFFF; +} + +.ui.inverted.popup:before { + background-color: #1B1C1D; + -webkit-box-shadow: none !important; + box-shadow: none !important; +} + +/*-------------- + Flowing + ---------------*/ + +.ui.flowing.popup { + max-width: none; +} + +/*-------------- + Sizes +---------------*/ + +.ui.popup { + font-size: 1rem; +} + +.ui.mini.popup { + font-size: 0.75rem; +} + +[data-tooltip][data-variation~="mini"]:before, +[data-tooltip][data-variation~="mini"]:after { + font-size: 0.75rem; +} + +.ui.tiny.popup { + font-size: 0.83333333rem; +} + +[data-tooltip][data-variation~="tiny"]:before, +[data-tooltip][data-variation~="tiny"]:after { + font-size: 0.83333333rem; +} + +.ui.small.popup { + font-size: 0.91666667rem; +} + +[data-tooltip][data-variation~="small"]:before, +[data-tooltip][data-variation~="small"]:after { + font-size: 0.91666667rem; +} + +.ui.large.popup { + font-size: 1.16666667rem; +} + +[data-tooltip][data-variation~="large"]:before, +[data-tooltip][data-variation~="large"]:after { + font-size: 1.16666667rem; +} + +.ui.big.popup { + font-size: 1.25rem; +} + +[data-tooltip][data-variation~="big"]:before, +[data-tooltip][data-variation~="big"]:after { + font-size: 1.25rem; +} + +.ui.huge.popup { + font-size: 1.41666667rem; +} + +[data-tooltip][data-variation~="huge"]:before, +[data-tooltip][data-variation~="huge"]:after { + font-size: 1.41666667rem; +} + +.ui.massive.popup { + font-size: 1.75rem; +} + +[data-tooltip][data-variation~="massive"]:before, +[data-tooltip][data-variation~="massive"]:after { + font-size: 1.75rem; +} + +/******************************* + Theme Overrides +*******************************/ + +/******************************* + User Overrides +*******************************/ /*! * # Fomantic-UI 2.8.8 - Progress Bar * http://github.com/fomantic/Fomantic-UI/ @@ -32824,6 +39270,862 @@ body.pushable > .pusher { /******************************* User Variable Overrides *******************************/ +/*! + * # Fomantic-UI 2.8.8 - Step + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + Plural +*******************************/ + +.ui.steps { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; + margin: 1em 0; + background: ''; + -webkit-box-shadow: none; + box-shadow: none; + line-height: 1.16666667em; + border-radius: 0.33333333rem; + border: 1px solid rgba(34, 36, 38, 0.15); +} + +.ui.steps:not(.unstackable) { + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +/* First Steps */ + +.ui.steps:first-child { + margin-top: 0; +} + +/* Last Steps */ + +.ui.steps:last-child { + margin-bottom: 0; +} + +/******************************* + Singular +*******************************/ + +.ui.steps .step { + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-flex: 1; + -ms-flex: 1 0 auto; + flex: 1 0 auto; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + vertical-align: middle; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + margin: 0 0; + padding: 1.16666667em 2em; + background: #FFFFFF; + color: rgba(0, 0, 0, 0.87); + -webkit-box-shadow: none; + box-shadow: none; + border-radius: 0; + border: none; + border-right: 1px solid rgba(34, 36, 38, 0.15); + -webkit-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease; +} + +/* Arrow */ + +.ui.steps .step:after { + display: none; + position: absolute; + z-index: 2; + content: ''; + top: 50%; + right: 0; + background-color: #FFFFFF; + width: 1.16666667em; + height: 1.16666667em; + border-style: solid; + border-color: rgba(34, 36, 38, 0.15); + border-width: 0 1px 1px 0; + -webkit-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease; + transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease; + -webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg); + transform: translateY(-50%) translateX(50%) rotate(-45deg); +} + +/* First Step */ + +.ui.steps .step:first-child { + padding-left: 2em; + border-radius: 0.33333333rem 0 0 0.33333333rem; +} + +/* Last Step */ + +.ui.steps .step:last-child { + border-radius: 0 0.33333333rem 0.33333333rem 0; + border-right: none; + margin-right: 0; +} + +/* Only Step */ + +.ui.steps .step:only-child { + border-radius: 0.33333333rem; +} + +/******************************* + Content +*******************************/ + +/* Title */ + +.ui.steps .step .title { + font-family: 'Raleway', sans-serif; + font-size: 1.16666667em; + font-weight: bold; +} + +.ui.steps .step > .title { + width: 100%; +} + +/* Description */ + +.ui.steps .step .description { + font-weight: normal; + font-size: 0.91666667em; + color: rgba(0, 0, 0, 0.87); +} + +.ui.steps .step > .description { + width: 100%; +} + +.ui.steps .step .title ~ .description { + margin-top: 0.25em; +} + +/* Icon */ + +.ui.steps .step > i.icon { + line-height: 1; + font-size: 2.5em; + margin: 0 1rem 0 0; +} + +.ui.steps .step > i.icon, +.ui.steps .step > i.icon ~ .content { + display: block; + -webkit-box-flex: 0; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -ms-flex-item-align: middle; + align-self: middle; +} + +/* Horizontal Icon */ + +.ui.steps:not(.vertical) .step > i.icon { + width: auto; +} + +/* Link */ + +.ui.steps .link.step, +.ui.steps a.step { + cursor: pointer; +} + +/******************************* + Types +*******************************/ + +/*-------------- + Ordered + ---------------*/ + +.ui.ordered.steps { + counter-reset: ordered; +} + +.ui.ordered.steps .step:before { + display: block; + position: static; + text-align: center; + content: counter(ordered); + -ms-flex-item-align: middle; + align-self: middle; + margin-right: 1rem; + font-size: 2.5em; + counter-increment: ordered; + font-family: inherit; + font-weight: bold; +} + +.ui.ordered.steps .step > * { + display: block; + -ms-flex-item-align: middle; + align-self: middle; +} + +/*-------------- + Vertical + ---------------*/ + +.ui.vertical.steps { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + overflow: visible; +} + +.ui.vertical.steps .step { + -webkit-box-pack: start; + -ms-flex-pack: start; + justify-content: flex-start; + border-radius: 0; + padding: 1.16666667em 2em; + border-right: none; + border-bottom: 1px solid rgba(34, 36, 38, 0.15); +} + +.ui.vertical.steps .step:first-child { + padding: 1.16666667em 2em; + border-radius: 0.33333333rem 0.33333333rem 0 0; +} + +.ui.vertical.steps .step:last-child { + border-bottom: none; + border-radius: 0 0 0.33333333rem 0.33333333rem; +} + +.ui.vertical.steps .step:only-child { + border-radius: 0.33333333rem; +} + +/* Arrow */ + +.ui.vertical.steps .step:after { + top: 50%; + right: 0; + border-width: 0 1px 1px 0; + display: none; +} + +.ui.right.vertical.steps .step:after { + border-width: 1px 0 0 1px; + left: 0; + right: 100%; + -webkit-transform: translateY(-50%) translateX(-50%) rotate(-45deg); + transform: translateY(-50%) translateX(-50%) rotate(-45deg); +} + +.ui.vertical.steps .active.step:after { + display: block; +} + +.ui.vertical.steps .step:last-child:after { + display: none; +} + +.ui.vertical.steps .active.step:last-child:after { + display: block; +} + +/*--------------- + Responsive +----------------*/ + +/* Mobile (Default) */ + +@media only screen and (max-width: 767.98px) { + .ui.steps:not(.unstackable) { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + overflow: visible; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } + + .ui.steps:not(.unstackable) .step { + width: 100% !important; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + border-radius: 0; + padding: 1.16666667em 2em; + border-right: none; + border-bottom: 1px solid rgba(34, 36, 38, 0.15); + } + + .ui.steps:not(.unstackable) .step:first-child { + padding: 1.16666667em 2em; + border-radius: 0.33333333rem 0.33333333rem 0 0; + } + + .ui.steps:not(.unstackable) .step:last-child { + border-radius: 0 0 0.33333333rem 0.33333333rem; + border-bottom: none; + } + + /* Arrow */ + + .ui.steps:not(.unstackable) .step:after { + top: unset; + bottom: -1.16666667em; + right: 50%; + -webkit-transform: translateY(-50%) translateX(50%) rotate(45deg); + transform: translateY(-50%) translateX(50%) rotate(45deg); + } + + .ui.vertical.steps .active.step:last-child:after { + display: none; + } + + /* Content */ + + .ui.steps:not(.unstackable) .step .content { + text-align: center; + } + + /* Icon */ + + .ui.steps:not(.unstackable) .step > i.icon, + .ui.ordered.steps:not(.unstackable) .step:before { + margin: 0 0 1rem 0; + } +} + +/******************************* + States +*******************************/ + +/* Link Hover */ + +.ui.steps .link.step:hover::after, +.ui.steps .link.step:hover, +.ui.steps a.step:hover::after, +.ui.steps a.step:hover { + background: #F9FAFB; + color: rgba(0, 0, 0, 0.8); +} + +/* Link Down */ + +.ui.steps .link.step:active::after, +.ui.steps .link.step:active, +.ui.steps a.step:active::after, +.ui.steps a.step:active { + background: #F3F4F5; + color: rgba(0, 0, 0, 0.9); +} + +/* Active */ + +.ui.steps .step.active { + cursor: auto; + background: #F3F4F5; +} + +.ui.steps .step.active:after { + background: #F3F4F5; +} + +.ui.steps .step.active .title { + color: #6435C9; +} + +.ui.ordered.steps .step.active:before, +.ui.steps .active.step i.icon { + color: rgba(0, 0, 0, 0.85); +} + +/* Active Arrow */ + +.ui.steps .step:after { + display: block; +} + +.ui.steps .active.step:after { + display: block; +} + +.ui.steps .step:last-child:after { + display: none; +} + +.ui.steps .active.step:last-child:after { + display: none; +} + +/* Active Hover */ + +.ui.steps .link.active.step:hover::after, +.ui.steps .link.active.step:hover, +.ui.steps a.active.step:hover::after, +.ui.steps a.active.step:hover { + cursor: pointer; + background: #DCDDDE; + color: rgba(0, 0, 0, 0.87); +} + +/* Completed */ + +.ui.steps .step.completed > i.icon:before, +.ui.ordered.steps .step.completed:before { + color: #21BA45; +} + +/* Disabled */ + +.ui.steps .disabled.step { + cursor: auto; + background: #FFFFFF; + pointer-events: none; +} + +.ui.steps .disabled.step, +.ui.steps .disabled.step .title, +.ui.steps .disabled.step .description { + color: rgba(40, 40, 40, 0.3); +} + +.ui.steps .disabled.step:after { + background: #FFFFFF; +} + +/******************************* + Variations +*******************************/ + +/*-------------- + Stackable + ---------------*/ + +/* Tablet Or Below */ + +@media only screen and (max-width: 991.98px) { + .ui[class*="tablet stackable"].steps { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + overflow: visible; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } + + /* Steps */ + + .ui[class*="tablet stackable"].steps .step { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + border-radius: 0; + padding: 1.16666667em 2em; + border-right: none; + border-bottom: 1px solid rgba(34, 36, 38, 0.15); + } + + .ui[class*="tablet stackable"].steps .step:first-child { + padding: 1.16666667em 2em; + border-radius: 0.33333333rem 0.33333333rem 0 0; + } + + .ui[class*="tablet stackable"].steps .step:last-child { + border-radius: 0 0 0.33333333rem 0.33333333rem; + border-bottom: none; + } + + /* Arrow */ + + .ui[class*="tablet stackable"].steps .step:after { + top: unset; + bottom: -1.16666667em; + right: 50%; + -webkit-transform: translateY(-50%) translateX(50%) rotate(45deg); + transform: translateY(-50%) translateX(50%) rotate(45deg); + } + + /* Content */ + + .ui[class*="tablet stackable"].steps .step .content { + text-align: center; + } + + /* Icon */ + + .ui[class*="tablet stackable"].steps .step > i.icon, + .ui[class*="tablet stackable"].ordered.steps .step:before { + margin: 0 0 1rem 0; + } +} + +/*-------------- + Fluid + ---------------*/ + +/* Fluid */ + +.ui.fluid.steps { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +/*-------------- + Attached + ---------------*/ + +/* Top */ + +.ui.attached.steps { + width: calc(100% + 2px) !important; + margin: 0 -1px 0; + max-width: calc(100% + 2px); + border-radius: 0.33333333rem 0.33333333rem 0 0; +} + +.ui.attached.steps .step:first-child { + border-radius: 0.33333333rem 0 0 0; +} + +.ui.attached.steps .step:last-child { + border-radius: 0 0.33333333rem 0 0; +} + +/* Bottom */ + +.ui.bottom.attached.steps { + margin: 0 -1px 0; + border-radius: 0 0 0.33333333rem 0.33333333rem; +} + +.ui.bottom.attached.steps .step:first-child { + border-radius: 0 0 0 0.33333333rem; +} + +.ui.bottom.attached.steps .step:last-child { + border-radius: 0 0 0.33333333rem 0; +} + +/*------------------- + Evenly Divided +--------------------*/ + +.ui.one.steps, +.ui.two.steps, +.ui.three.steps, +.ui.four.steps, +.ui.five.steps, +.ui.six.steps, +.ui.seven.steps, +.ui.eight.steps { + width: 100%; +} + +.ui.one.steps > .step, +.ui.two.steps > .step, +.ui.three.steps > .step, +.ui.four.steps > .step, +.ui.five.steps > .step, +.ui.six.steps > .step, +.ui.seven.steps > .step, +.ui.eight.steps > .step { + -ms-flex-wrap: nowrap; + flex-wrap: nowrap; +} + +.ui.one.steps > .step { + width: 100%; +} + +.ui.two.steps > .step { + width: 50%; +} + +.ui.three.steps > .step { + width: 33.333%; +} + +.ui.four.steps > .step { + width: 25%; +} + +.ui.five.steps > .step { + width: 20%; +} + +.ui.six.steps > .step { + width: 16.666%; +} + +.ui.seven.steps > .step { + width: 14.285%; +} + +.ui.eight.steps > .step { + width: 12.5%; +} + +/*------------------- + Sizes +--------------------*/ + +.ui.steps .step, +.ui.step { + font-size: 1rem; +} + +.ui.mini.steps .step, +.ui.mini.step { + font-size: 0.75rem; +} + +.ui.tiny.steps .step, +.ui.tiny.step { + font-size: 0.83333333rem; +} + +.ui.small.steps .step, +.ui.small.step { + font-size: 0.91666667rem; +} + +.ui.large.steps .step, +.ui.large.step { + font-size: 1.16666667rem; +} + +.ui.big.steps .step, +.ui.big.step { + font-size: 1.25rem; +} + +.ui.huge.steps .step, +.ui.huge.step { + font-size: 1.41666667rem; +} + +.ui.massive.steps .step, +.ui.massive.step { + font-size: 1.75rem; +} + +/*-------------- + Inverted + ---------------*/ + +.ui.inverted.steps { + border: 1px solid #555555; +} + +.ui.inverted.steps .step { + color: rgba(255, 255, 255, 0.9); + background: #1B1C1D; + border-color: #555555; +} + +.ui.inverted.steps .step:after { + background-color: #1B1C1D; + border-color: #555555; +} + +.ui.inverted.steps .step .description { + color: rgba(255, 255, 255, 0.9); +} + +/* Active */ + +.ui.inverted.steps .step.active, +.ui.inverted.steps .step.active:after { + background: #333333; +} + +.ui.inverted.ordered.steps .step.active:before, +.ui.inverted.steps .active.step i.icon { + color: #ffffff; +} + +/* Disabled */ + +.ui.inverted.steps .disabled.step, +.ui.inverted.steps .disabled.step:after { + background: #222222; +} + +.ui.inverted.steps .disabled.step, +.ui.inverted.steps .disabled.step .title, +.ui.inverted.steps .disabled.step .description { + color: rgba(225, 225, 225, 0.3); +} + +/* Link Hover */ + +.ui.inverted.steps .link.step:hover::after, +.ui.inverted.steps .link.step:hover, +.ui.inverted.steps a.step:hover::after, +.ui.inverted.steps a.step:hover { + background: #3F3F3F; + color: #ffffff; +} + +/* Link Down */ + +.ui.inverted.steps .link.step:active::after, +.ui.inverted.steps .link.step:active, +.ui.inverted.steps a.step:active::after, +.ui.inverted.steps a.step:active { + background: #444444; + color: #ffffff; +} + +/******************************* + Theme Overrides +*******************************/ + +@font-face { + font-family: 'Step'; + src: url(data:application/x-font-ttf;charset=utf-8;;base64,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) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,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) format('woff'); +} + +.ui.steps .step.completed > .icon:before, +.ui.ordered.steps .step.completed:before { + font-family: 'Step'; + content: '\e800'; + /* '' */ +} + +/******************************* + Site Overrides +*******************************/ +/*! + * # Fomantic-UI 2.8.8 - Tab + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +/******************************* + UI Tabs +*******************************/ + +.ui.tab { + display: none; +} + +/******************************* + States +*******************************/ + +/*-------------------- + Active +---------------------*/ + +.ui.tab.active, +.ui.tab.open { + display: block; +} + +/*-------------------- + Loading + ---------------------*/ + +.ui.tab.loading { + position: relative; + overflow: hidden; + display: block; + min-height: 250px; +} + +.ui.tab.loading * { + position: relative !important; + left: -10000px !important; +} + +.ui.tab.loading:before, +.ui.tab.loading.segment:before { + position: absolute; + content: ''; + top: 50%; + left: 50%; + margin: -1.25em 0 0 -1.25em; + width: 2.5em; + height: 2.5em; + border-radius: 500rem; + border: 0.2em solid rgba(0, 0, 0, 0.1); +} + +.ui.tab.loading:after, +.ui.tab.loading.segment:after { + position: absolute; + content: ''; + top: 50%; + left: 50%; + margin: -1.25em 0 0 -1.25em; + width: 2.5em; + height: 2.5em; + -webkit-animation: loader 0.6s infinite linear; + animation: loader 0.6s infinite linear; + border: 0.2em solid #767676; + border-radius: 500rem; + -webkit-box-shadow: 0 0 0 1px transparent; + box-shadow: 0 0 0 1px transparent; +} + +/******************************* + Tab Overrides +*******************************/ + +/******************************* + User Overrides +*******************************/ /*! * # Fomantic-UI 2.8.8 - Text * http://github.com/fomantic/Fomantic-UI/ @@ -33964,6536 +41266,6 @@ span.ui.massive.text { opacity: 0; } } -/*! - * # Fomantic-UI 2.8.8 - Form - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Elements -*******************************/ - -/*-------------------- - Form ----------------------*/ - -.ui.form { - position: relative; - max-width: 100%; -} - -/*-------------------- - Content ----------------------*/ - -.ui.form > p { - margin: 1em 0; -} - -/*-------------------- - Field ----------------------*/ - -.ui.form .field { - clear: both; - margin: 0 0 1em; -} - -.ui.form .fields .fields, -.ui.form .field:last-child, -.ui.form .fields:last-child .field { - margin-bottom: 0; -} - -.ui.form .fields .field { - clear: both; - margin: 0; -} - -/*-------------------- - Labels ----------------------*/ - -.ui.form .field > label { - display: block; - margin: 0 0 0.33333333rem 0; - color: rgba(0, 0, 0, 0.87); - font-size: 0.91666667em; - font-weight: bold; - text-transform: none; -} - -/*-------------------- - Standard Inputs ----------------------*/ - -.ui.form textarea, -.ui.form input:not([type]), -.ui.form input[type="date"], -.ui.form input[type="datetime-local"], -.ui.form input[type="email"], -.ui.form input[type="number"], -.ui.form input[type="password"], -.ui.form input[type="search"], -.ui.form input[type="tel"], -.ui.form input[type="time"], -.ui.form input[type="text"], -.ui.form input[type="file"], -.ui.form input[type="url"] { - width: 100%; - vertical-align: top; -} - -/* Set max height on unusual input */ - -.ui.form ::-webkit-datetime-edit, -.ui.form ::-webkit-inner-spin-button { - height: 1.21428571em; -} - -.ui.form input:not([type]), -.ui.form input[type="date"], -.ui.form input[type="datetime-local"], -.ui.form input[type="email"], -.ui.form input[type="number"], -.ui.form input[type="password"], -.ui.form input[type="search"], -.ui.form input[type="tel"], -.ui.form input[type="time"], -.ui.form input[type="text"], -.ui.form input[type="file"], -.ui.form input[type="url"] { - font-family: 'Raleway', sans-serif; - margin: 0; - outline: none; - -webkit-appearance: none; - -webkit-tap-highlight-color: rgba(255, 255, 255, 0); - line-height: 1.21428571em; - padding: 0.80952381em 1.16666667em; - font-size: 1em; - background: #FFFFFF; - border: 1px solid rgba(34, 36, 38, 0.15); - color: rgba(0, 0, 0, 0.87); - border-radius: 0.33333333rem; - -webkit-box-shadow: 0 0 0 0 transparent inset; - box-shadow: 0 0 0 0 transparent inset; - -webkit-transition: color 0.1s ease, border-color 0.1s ease; - transition: color 0.1s ease, border-color 0.1s ease; -} - -/* Text Area */ - -.ui.input textarea, -.ui.form textarea { - margin: 0; - -webkit-appearance: none; - -webkit-tap-highlight-color: rgba(255, 255, 255, 0); - padding: 0.91666667em 1.16666667em; - background: #FFFFFF; - border: 1px solid rgba(34, 36, 38, 0.15); - outline: none; - color: rgba(0, 0, 0, 0.87); - border-radius: 0.33333333rem; - -webkit-box-shadow: 0 0 0 0 transparent inset; - box-shadow: 0 0 0 0 transparent inset; - -webkit-transition: color 0.1s ease, border-color 0.1s ease; - transition: color 0.1s ease, border-color 0.1s ease; - font-size: 1em; - font-family: 'Raleway', sans-serif; - line-height: 1.2857; - resize: vertical; -} - -.ui.form textarea:not([rows]) { - height: 12em; - min-height: 8em; - max-height: 24em; -} - -.ui.form textarea, -.ui.form input[type="checkbox"] { - vertical-align: top; -} - -/*-------------------- - Checkbox margin ----------------------*/ - -.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) label + .ui.ui.checkbox { - margin-top: 0.7em; -} - -.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.checkbox { - margin-top: 2.41428571em; -} - -.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.toggle.checkbox { - margin-top: 2.21428571em; -} - -.ui.form .fields:not(.grouped):not(.inline) .field:not(:only-child) .ui.slider.checkbox { - margin-top: 2.61428571em; -} - -.ui.ui.form .field .fields .field:not(:only-child) .ui.checkbox { - margin-top: 0.6em; -} - -.ui.ui.form .field .fields .field:not(:only-child) .ui.toggle.checkbox { - margin-top: 0.5em; -} - -.ui.ui.form .field .fields .field:not(:only-child) .ui.slider.checkbox { - margin-top: 0.7em; -} - -/*-------------------- - Transparent - ---------------------*/ - -.ui.form .field .transparent.input:not(.icon) input, -.ui.form .field input.transparent, -.ui.form .field textarea.transparent { - padding: 0.80952381em 1.16666667em; -} - -.ui.form .field input.transparent, -.ui.form .field textarea.transparent { - border-color: transparent !important; - background-color: transparent !important; - -webkit-box-shadow: none !important; - box-shadow: none !important; -} - -/*-------------------------- - Input w/ attached Button ----------------------------*/ - -.ui.form input.attached { - width: auto; -} - -/*-------------------- - Basic Select ----------------------*/ - -.ui.form select { - display: block; - height: auto; - width: 100%; - background: #FFFFFF; - border: 1px solid rgba(34, 36, 38, 0.15); - border-radius: 0.33333333rem; - -webkit-box-shadow: 0 0 0 0 transparent inset; - box-shadow: 0 0 0 0 transparent inset; - padding: 0.62em 1.16666667em; - color: rgba(0, 0, 0, 0.87); - -webkit-transition: color 0.1s ease, border-color 0.1s ease; - transition: color 0.1s ease, border-color 0.1s ease; -} - -/*-------------------- - Dropdown ----------------------*/ - -/* Block */ - -.ui.form .field > .selection.dropdown { - min-width: auto; - width: 100%; -} - -.ui.form .field > .selection.dropdown > .dropdown.icon { - float: right; -} - -/* Inline */ - -.ui.form .inline.fields .field > .selection.dropdown, -.ui.form .inline.field > .selection.dropdown { - width: auto; -} - -.ui.form .inline.fields .field > .selection.dropdown > .dropdown.icon, -.ui.form .inline.field > .selection.dropdown > .dropdown.icon { - float: none; -} - -/*-------------------- - UI Input ----------------------*/ - -/* Block */ - -.ui.form .field .ui.input, -.ui.form .fields .field .ui.input, -.ui.form .wide.field .ui.input { - width: 100%; -} - -/* Inline */ - -.ui.form .inline.fields .field:not(.wide) .ui.input, -.ui.form .inline.field:not(.wide) .ui.input { - width: auto; - vertical-align: middle; -} - -/* Auto Input */ - -.ui.form .fields .field .ui.input input, -.ui.form .field .ui.input input { - width: auto; -} - -/* Full Width Input */ - -.ui.form .ten.fields .ui.input input, -.ui.form .nine.fields .ui.input input, -.ui.form .eight.fields .ui.input input, -.ui.form .seven.fields .ui.input input, -.ui.form .six.fields .ui.input input, -.ui.form .five.fields .ui.input input, -.ui.form .four.fields .ui.input input, -.ui.form .three.fields .ui.input input, -.ui.form .two.fields .ui.input input, -.ui.form .wide.field .ui.input input { - -webkit-box-flex: 1; - -ms-flex: 1 0 auto; - flex: 1 0 auto; - width: 0; -} - -/*-------------------- - Types of Messages ----------------------*/ - -.ui.form .error.message, -.ui.form .error.message:empty { - display: none; -} - -.ui.form .info.message, -.ui.form .info.message:empty { - display: none; -} - -.ui.form .success.message, -.ui.form .success.message:empty { - display: none; -} - -.ui.form .warning.message, -.ui.form .warning.message:empty { - display: none; -} - -/* Assumptions */ - -.ui.form .message:first-child { - margin-top: 0; -} - -/*-------------------- - Validation Prompt ----------------------*/ - -.ui.form .field .prompt.label { - white-space: normal; - background: #FFFFFF !important; - border: 1px solid #E0B4B4 !important; - color: #9F3A38 !important; -} - -.ui.form .inline.fields .field .prompt, -.ui.form .inline.field .prompt { - vertical-align: top; - margin: -0.25em 0 -0.5em 0.5em; -} - -.ui.form .inline.fields .field .prompt:before, -.ui.form .inline.field .prompt:before { - border-width: 0 0 1px 1px; - bottom: auto; - right: auto; - top: 50%; - left: 0; -} - -/******************************* - States -*******************************/ - -/*-------------------- - Autofilled ----------------------*/ - -.ui.form .field.field input:-webkit-autofill { - -webkit-box-shadow: 0 0 0 100px #FFFFF0 inset !important; - box-shadow: 0 0 0 100px #FFFFF0 inset !important; - border-color: #E5DFA1 !important; -} - -/* Focus */ - -.ui.form .field.field input:-webkit-autofill:focus { - -webkit-box-shadow: 0 0 0 100px #FFFFF0 inset !important; - box-shadow: 0 0 0 100px #FFFFF0 inset !important; - border-color: #D5C315 !important; -} - -/*-------------------- - Placeholder ----------------------*/ - -/* browsers require these rules separate */ - -.ui.form ::-webkit-input-placeholder { - color: rgba(191, 191, 191, 0.87); -} - -.ui.form :-ms-input-placeholder { - color: rgba(191, 191, 191, 0.87) !important; -} - -.ui.form ::-moz-placeholder { - color: rgba(191, 191, 191, 0.87); - opacity: 1; -} - -.ui.form :focus::-webkit-input-placeholder { - color: rgba(115, 115, 115, 0.87); -} - -.ui.form :focus:-ms-input-placeholder { - color: rgba(115, 115, 115, 0.87) !important; -} - -.ui.form :focus::-moz-placeholder { - color: rgba(115, 115, 115, 0.87); -} - -/*-------------------- - Focus ----------------------*/ - -.ui.form input:not([type]):focus, -.ui.form input[type="date"]:focus, -.ui.form input[type="datetime-local"]:focus, -.ui.form input[type="email"]:focus, -.ui.form input[type="number"]:focus, -.ui.form input[type="password"]:focus, -.ui.form input[type="search"]:focus, -.ui.form input[type="tel"]:focus, -.ui.form input[type="time"]:focus, -.ui.form input[type="text"]:focus, -.ui.form input[type="file"]:focus, -.ui.form input[type="url"]:focus { - color: rgba(0, 0, 0, 0.95); - border-color: #6435C9; - border-radius: 0.33333333rem; - background: #FFFFFF; - -webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; - box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; -} - -.ui.form .ui.action.input:not([class*="left action"]) input:not([type]):focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="date"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="datetime-local"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="email"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="number"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="password"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="search"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="tel"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="time"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="text"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="file"]:focus, -.ui.form .ui.action.input:not([class*="left action"]) input[type="url"]:focus { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.ui.form .ui[class*="left action"].input input:not([type]), -.ui.form .ui[class*="left action"].input input[type="date"], -.ui.form .ui[class*="left action"].input input[type="datetime-local"], -.ui.form .ui[class*="left action"].input input[type="email"], -.ui.form .ui[class*="left action"].input input[type="number"], -.ui.form .ui[class*="left action"].input input[type="password"], -.ui.form .ui[class*="left action"].input input[type="search"], -.ui.form .ui[class*="left action"].input input[type="tel"], -.ui.form .ui[class*="left action"].input input[type="time"], -.ui.form .ui[class*="left action"].input input[type="text"], -.ui.form .ui[class*="left action"].input input[type="file"], -.ui.form .ui[class*="left action"].input input[type="url"] { - border-bottom-left-radius: 0; - border-top-left-radius: 0; -} - -.ui.form textarea:focus { - color: rgba(0, 0, 0, 0.95); - border-color: #6435C9; - border-radius: 0.33333333rem; - background: #FFFFFF; - -webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; - box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; - -webkit-appearance: none; -} - -/*-------------------- - States - ---------------------*/ - -/* On Form */ - -.ui.form.error .error.message:not(:empty) { - display: block; -} - -.ui.form.error .compact.error.message:not(:empty) { - display: inline-block; -} - -.ui.form.error .icon.error.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -/* On Field(s) */ - -.ui.form .fields.error .error.message:not(:empty), -.ui.form .field.error .error.message:not(:empty) { - display: block; -} - -.ui.form .fields.error .compact.error.message:not(:empty), -.ui.form .field.error .compact.error.message:not(:empty) { - display: inline-block; -} - -.ui.form .fields.error .icon.error.message:not(:empty), -.ui.form .field.error .icon.error.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.ui.ui.form .fields.error .field label, -.ui.ui.form .fields.error .field .ui.label:not(.corner), -.ui.ui.form .field.error label, -.ui.ui.form .field.error .ui.label:not(.corner), -.ui.ui.form .fields.error .field .input, -.ui.ui.form .field.error .input { - color: #9F3A38; -} - -.ui.form .fields.error .field .ui.label, -.ui.form .field.error .ui.label { - background-color: #ecd1d1; -} - -.ui.form .fields.error .field .corner.label, -.ui.form .field.error .corner.label { - border-color: #9F3A38; - color: #FFFFFF; -} - -.ui.form .fields.error .field textarea, -.ui.form .fields.error .field select, -.ui.form .fields.error .field input:not([type]), -.ui.form .fields.error .field input[type="date"], -.ui.form .fields.error .field input[type="datetime-local"], -.ui.form .fields.error .field input[type="email"], -.ui.form .fields.error .field input[type="number"], -.ui.form .fields.error .field input[type="password"], -.ui.form .fields.error .field input[type="search"], -.ui.form .fields.error .field input[type="tel"], -.ui.form .fields.error .field input[type="time"], -.ui.form .fields.error .field input[type="text"], -.ui.form .fields.error .field input[type="file"], -.ui.form .fields.error .field input[type="url"], -.ui.form .field.error textarea, -.ui.form .field.error select, -.ui.form .field.error input:not([type]), -.ui.form .field.error input[type="date"], -.ui.form .field.error input[type="datetime-local"], -.ui.form .field.error input[type="email"], -.ui.form .field.error input[type="number"], -.ui.form .field.error input[type="password"], -.ui.form .field.error input[type="search"], -.ui.form .field.error input[type="tel"], -.ui.form .field.error input[type="time"], -.ui.form .field.error input[type="text"], -.ui.form .field.error input[type="file"], -.ui.form .field.error input[type="url"] { - color: #9F3A38; - background: #FFF6F6; - border-color: #E0B4B4; - border-radius: ''; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.form .field.error textarea:focus, -.ui.form .field.error select:focus, -.ui.form .field.error input:not([type]):focus, -.ui.form .field.error input[type="date"]:focus, -.ui.form .field.error input[type="datetime-local"]:focus, -.ui.form .field.error input[type="email"]:focus, -.ui.form .field.error input[type="number"]:focus, -.ui.form .field.error input[type="password"]:focus, -.ui.form .field.error input[type="search"]:focus, -.ui.form .field.error input[type="tel"]:focus, -.ui.form .field.error input[type="time"]:focus, -.ui.form .field.error input[type="text"]:focus, -.ui.form .field.error input[type="file"]:focus, -.ui.form .field.error input[type="url"]:focus { - background: #FFF6F6; - border-color: #E0B4B4; - color: #9F3A38; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Preserve Native Select Stylings */ - -.ui.form .field.error select { - -webkit-appearance: menulist-button; -} - -/*------------------ - Input State - --------------------*/ - -/* Transparent */ - -.ui.form .field.error .transparent.input input, -.ui.form .field.error .transparent.input textarea, -.ui.form .field.error input.transparent, -.ui.form .field.error textarea.transparent { - background-color: #FFF6F6 !important; - color: #9F3A38 !important; -} - -/* Autofilled */ - -.ui.form .error.error input:-webkit-autofill { - -webkit-box-shadow: 0 0 0 100px #FFFAF0 inset !important; - box-shadow: 0 0 0 100px #FFFAF0 inset !important; - border-color: #E0B4B4 !important; -} - -/* Placeholder */ - -.ui.form .error ::-webkit-input-placeholder { - color: #e7bdbc; -} - -.ui.form .error :-ms-input-placeholder { - color: #e7bdbc !important; -} - -.ui.form .error ::-moz-placeholder { - color: #e7bdbc; -} - -.ui.form .error :focus::-webkit-input-placeholder { - color: #da9796; -} - -.ui.form .error :focus:-ms-input-placeholder { - color: #da9796 !important; -} - -.ui.form .error :focus::-moz-placeholder { - color: #da9796; -} - -/*------------------ - Dropdown State - --------------------*/ - -.ui.form .fields.error .field .ui.dropdown, -.ui.form .fields.error .field .ui.dropdown .item, -.ui.form .field.error .ui.dropdown, -.ui.form .field.error .ui.dropdown > .text, -.ui.form .field.error .ui.dropdown .item { - background: #FFF6F6; - color: #9F3A38; -} - -.ui.form .fields.error .field .ui.dropdown, -.ui.form .field.error .ui.dropdown { - border-color: #E0B4B4 !important; -} - -.ui.form .fields.error .field .ui.dropdown:hover, -.ui.form .field.error .ui.dropdown:hover { - border-color: #E0B4B4 !important; -} - -.ui.form .fields.error .field .ui.dropdown:hover .menu, -.ui.form .field.error .ui.dropdown:hover .menu { - border-color: #E0B4B4; -} - -.ui.form .fields.error .field .ui.multiple.selection.dropdown > .label, -.ui.form .field.error .ui.multiple.selection.dropdown > .label { - background-color: #EACBCB; - color: #9F3A38; -} - -/* Hover */ - -.ui.form .fields.error .field .ui.dropdown .menu .item:hover, -.ui.form .field.error .ui.dropdown .menu .item:hover { - background-color: #FBE7E7; -} - -/* Selected */ - -.ui.form .fields.error .field .ui.dropdown .menu .selected.item, -.ui.form .field.error .ui.dropdown .menu .selected.item { - background-color: #FBE7E7; -} - -/* Active */ - -.ui.form .fields.error .field .ui.dropdown .menu .active.item, -.ui.form .field.error .ui.dropdown .menu .active.item { - background-color: #FDCFCF !important; -} - -/*-------------------- - Checkbox State - ---------------------*/ - -.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label, -.ui.form .field.error .checkbox:not(.toggle):not(.slider) label, -.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box, -.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box { - color: #9F3A38; -} - -.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .field.error .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box:before, -.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box:before { - background: #FFF6F6; - border-color: #E0B4B4; -} - -.ui.form .fields.error .field .checkbox label:after, -.ui.form .field.error .checkbox label:after, -.ui.form .fields.error .field .checkbox .box:after, -.ui.form .field.error .checkbox .box:after { - color: #9F3A38; -} - -.ui.inverted.form .fields.error .field label, -.ui.inverted.form .error.field label { - color: #ecd1d1; -} - -/* On Form */ - -.ui.form.info .info.message:not(:empty) { - display: block; -} - -.ui.form.info .compact.info.message:not(:empty) { - display: inline-block; -} - -.ui.form.info .icon.info.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -/* On Field(s) */ - -.ui.form .fields.info .info.message:not(:empty), -.ui.form .field.info .info.message:not(:empty) { - display: block; -} - -.ui.form .fields.info .compact.info.message:not(:empty), -.ui.form .field.info .compact.info.message:not(:empty) { - display: inline-block; -} - -.ui.form .fields.info .icon.info.message:not(:empty), -.ui.form .field.info .icon.info.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.ui.ui.form .fields.info .field label, -.ui.ui.form .fields.info .field .ui.label:not(.corner), -.ui.ui.form .field.info label, -.ui.ui.form .field.info .ui.label:not(.corner), -.ui.ui.form .fields.info .field .input, -.ui.ui.form .field.info .input { - color: #276F86; -} - -.ui.form .fields.info .field .ui.label, -.ui.form .field.info .ui.label { - background-color: #c6e3e9; -} - -.ui.form .fields.info .field .corner.label, -.ui.form .field.info .corner.label { - border-color: #276F86; - color: #FFFFFF; -} - -.ui.form .fields.info .field textarea, -.ui.form .fields.info .field select, -.ui.form .fields.info .field input:not([type]), -.ui.form .fields.info .field input[type="date"], -.ui.form .fields.info .field input[type="datetime-local"], -.ui.form .fields.info .field input[type="email"], -.ui.form .fields.info .field input[type="number"], -.ui.form .fields.info .field input[type="password"], -.ui.form .fields.info .field input[type="search"], -.ui.form .fields.info .field input[type="tel"], -.ui.form .fields.info .field input[type="time"], -.ui.form .fields.info .field input[type="text"], -.ui.form .fields.info .field input[type="file"], -.ui.form .fields.info .field input[type="url"], -.ui.form .field.info textarea, -.ui.form .field.info select, -.ui.form .field.info input:not([type]), -.ui.form .field.info input[type="date"], -.ui.form .field.info input[type="datetime-local"], -.ui.form .field.info input[type="email"], -.ui.form .field.info input[type="number"], -.ui.form .field.info input[type="password"], -.ui.form .field.info input[type="search"], -.ui.form .field.info input[type="tel"], -.ui.form .field.info input[type="time"], -.ui.form .field.info input[type="text"], -.ui.form .field.info input[type="file"], -.ui.form .field.info input[type="url"] { - color: #276F86; - background: #F8FFFF; - border-color: #A9D5DE; - border-radius: ''; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.form .field.info textarea:focus, -.ui.form .field.info select:focus, -.ui.form .field.info input:not([type]):focus, -.ui.form .field.info input[type="date"]:focus, -.ui.form .field.info input[type="datetime-local"]:focus, -.ui.form .field.info input[type="email"]:focus, -.ui.form .field.info input[type="number"]:focus, -.ui.form .field.info input[type="password"]:focus, -.ui.form .field.info input[type="search"]:focus, -.ui.form .field.info input[type="tel"]:focus, -.ui.form .field.info input[type="time"]:focus, -.ui.form .field.info input[type="text"]:focus, -.ui.form .field.info input[type="file"]:focus, -.ui.form .field.info input[type="url"]:focus { - background: #F8FFFF; - border-color: #A9D5DE; - color: #276F86; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Preserve Native Select Stylings */ - -.ui.form .field.info select { - -webkit-appearance: menulist-button; -} - -/*------------------ - Input State - --------------------*/ - -/* Transparent */ - -.ui.form .field.info .transparent.input input, -.ui.form .field.info .transparent.input textarea, -.ui.form .field.info input.transparent, -.ui.form .field.info textarea.transparent { - background-color: #F8FFFF !important; - color: #276F86 !important; -} - -/* Autofilled */ - -.ui.form .info.info input:-webkit-autofill { - -webkit-box-shadow: 0 0 0 100px #F0FAFF inset !important; - box-shadow: 0 0 0 100px #F0FAFF inset !important; - border-color: #b3e0e0 !important; -} - -/* Placeholder */ - -.ui.form .info ::-webkit-input-placeholder { - color: #98cfe1; -} - -.ui.form .info :-ms-input-placeholder { - color: #98cfe1 !important; -} - -.ui.form .info ::-moz-placeholder { - color: #98cfe1; -} - -.ui.form .info :focus::-webkit-input-placeholder { - color: #70bdd6; -} - -.ui.form .info :focus:-ms-input-placeholder { - color: #70bdd6 !important; -} - -.ui.form .info :focus::-moz-placeholder { - color: #70bdd6; -} - -/*------------------ - Dropdown State - --------------------*/ - -.ui.form .fields.info .field .ui.dropdown, -.ui.form .fields.info .field .ui.dropdown .item, -.ui.form .field.info .ui.dropdown, -.ui.form .field.info .ui.dropdown > .text, -.ui.form .field.info .ui.dropdown .item { - background: #F8FFFF; - color: #276F86; -} - -.ui.form .fields.info .field .ui.dropdown, -.ui.form .field.info .ui.dropdown { - border-color: #A9D5DE !important; -} - -.ui.form .fields.info .field .ui.dropdown:hover, -.ui.form .field.info .ui.dropdown:hover { - border-color: #A9D5DE !important; -} - -.ui.form .fields.info .field .ui.dropdown:hover .menu, -.ui.form .field.info .ui.dropdown:hover .menu { - border-color: #A9D5DE; -} - -.ui.form .fields.info .field .ui.multiple.selection.dropdown > .label, -.ui.form .field.info .ui.multiple.selection.dropdown > .label { - background-color: #cce3ea; - color: #276F86; -} - -/* Hover */ - -.ui.form .fields.info .field .ui.dropdown .menu .item:hover, -.ui.form .field.info .ui.dropdown .menu .item:hover { - background-color: #e9f2fb; -} - -/* Selected */ - -.ui.form .fields.info .field .ui.dropdown .menu .selected.item, -.ui.form .field.info .ui.dropdown .menu .selected.item { - background-color: #e9f2fb; -} - -/* Active */ - -.ui.form .fields.info .field .ui.dropdown .menu .active.item, -.ui.form .field.info .ui.dropdown .menu .active.item { - background-color: #cef1fd !important; -} - -/*-------------------- - Checkbox State - ---------------------*/ - -.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label, -.ui.form .field.info .checkbox:not(.toggle):not(.slider) label, -.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) .box, -.ui.form .field.info .checkbox:not(.toggle):not(.slider) .box { - color: #276F86; -} - -.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .field.info .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) .box:before, -.ui.form .field.info .checkbox:not(.toggle):not(.slider) .box:before { - background: #F8FFFF; - border-color: #A9D5DE; -} - -.ui.form .fields.info .field .checkbox label:after, -.ui.form .field.info .checkbox label:after, -.ui.form .fields.info .field .checkbox .box:after, -.ui.form .field.info .checkbox .box:after { - color: #276F86; -} - -.ui.inverted.form .fields.info .field label, -.ui.inverted.form .info.field label { - color: #c6e3e9; -} - -/* On Form */ - -.ui.form.success .success.message:not(:empty) { - display: block; -} - -.ui.form.success .compact.success.message:not(:empty) { - display: inline-block; -} - -.ui.form.success .icon.success.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -/* On Field(s) */ - -.ui.form .fields.success .success.message:not(:empty), -.ui.form .field.success .success.message:not(:empty) { - display: block; -} - -.ui.form .fields.success .compact.success.message:not(:empty), -.ui.form .field.success .compact.success.message:not(:empty) { - display: inline-block; -} - -.ui.form .fields.success .icon.success.message:not(:empty), -.ui.form .field.success .icon.success.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.ui.ui.form .fields.success .field label, -.ui.ui.form .fields.success .field .ui.label:not(.corner), -.ui.ui.form .field.success label, -.ui.ui.form .field.success .ui.label:not(.corner), -.ui.ui.form .fields.success .field .input, -.ui.ui.form .field.success .input { - color: #2C662D; -} - -.ui.form .fields.success .field .ui.label, -.ui.form .field.success .ui.label { - background-color: #b9d1ad; -} - -.ui.form .fields.success .field .corner.label, -.ui.form .field.success .corner.label { - border-color: #2C662D; - color: #FFFFFF; -} - -.ui.form .fields.success .field textarea, -.ui.form .fields.success .field select, -.ui.form .fields.success .field input:not([type]), -.ui.form .fields.success .field input[type="date"], -.ui.form .fields.success .field input[type="datetime-local"], -.ui.form .fields.success .field input[type="email"], -.ui.form .fields.success .field input[type="number"], -.ui.form .fields.success .field input[type="password"], -.ui.form .fields.success .field input[type="search"], -.ui.form .fields.success .field input[type="tel"], -.ui.form .fields.success .field input[type="time"], -.ui.form .fields.success .field input[type="text"], -.ui.form .fields.success .field input[type="file"], -.ui.form .fields.success .field input[type="url"], -.ui.form .field.success textarea, -.ui.form .field.success select, -.ui.form .field.success input:not([type]), -.ui.form .field.success input[type="date"], -.ui.form .field.success input[type="datetime-local"], -.ui.form .field.success input[type="email"], -.ui.form .field.success input[type="number"], -.ui.form .field.success input[type="password"], -.ui.form .field.success input[type="search"], -.ui.form .field.success input[type="tel"], -.ui.form .field.success input[type="time"], -.ui.form .field.success input[type="text"], -.ui.form .field.success input[type="file"], -.ui.form .field.success input[type="url"] { - color: #2C662D; - background: #FCFFF5; - border-color: #A3C293; - border-radius: ''; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.form .field.success textarea:focus, -.ui.form .field.success select:focus, -.ui.form .field.success input:not([type]):focus, -.ui.form .field.success input[type="date"]:focus, -.ui.form .field.success input[type="datetime-local"]:focus, -.ui.form .field.success input[type="email"]:focus, -.ui.form .field.success input[type="number"]:focus, -.ui.form .field.success input[type="password"]:focus, -.ui.form .field.success input[type="search"]:focus, -.ui.form .field.success input[type="tel"]:focus, -.ui.form .field.success input[type="time"]:focus, -.ui.form .field.success input[type="text"]:focus, -.ui.form .field.success input[type="file"]:focus, -.ui.form .field.success input[type="url"]:focus { - background: #FCFFF5; - border-color: #A3C293; - color: #2C662D; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Preserve Native Select Stylings */ - -.ui.form .field.success select { - -webkit-appearance: menulist-button; -} - -/*------------------ - Input State - --------------------*/ - -/* Transparent */ - -.ui.form .field.success .transparent.input input, -.ui.form .field.success .transparent.input textarea, -.ui.form .field.success input.transparent, -.ui.form .field.success textarea.transparent { - background-color: #FCFFF5 !important; - color: #2C662D !important; -} - -/* Autofilled */ - -.ui.form .success.success input:-webkit-autofill { - -webkit-box-shadow: 0 0 0 100px #F0FFF0 inset !important; - box-shadow: 0 0 0 100px #F0FFF0 inset !important; - border-color: #bee0b3 !important; -} - -/* Placeholder */ - -.ui.form .success ::-webkit-input-placeholder { - color: #8fcf90; -} - -.ui.form .success :-ms-input-placeholder { - color: #8fcf90 !important; -} - -.ui.form .success ::-moz-placeholder { - color: #8fcf90; -} - -.ui.form .success :focus::-webkit-input-placeholder { - color: #6cbf6d; -} - -.ui.form .success :focus:-ms-input-placeholder { - color: #6cbf6d !important; -} - -.ui.form .success :focus::-moz-placeholder { - color: #6cbf6d; -} - -/*------------------ - Dropdown State - --------------------*/ - -.ui.form .fields.success .field .ui.dropdown, -.ui.form .fields.success .field .ui.dropdown .item, -.ui.form .field.success .ui.dropdown, -.ui.form .field.success .ui.dropdown > .text, -.ui.form .field.success .ui.dropdown .item { - background: #FCFFF5; - color: #2C662D; -} - -.ui.form .fields.success .field .ui.dropdown, -.ui.form .field.success .ui.dropdown { - border-color: #A3C293 !important; -} - -.ui.form .fields.success .field .ui.dropdown:hover, -.ui.form .field.success .ui.dropdown:hover { - border-color: #A3C293 !important; -} - -.ui.form .fields.success .field .ui.dropdown:hover .menu, -.ui.form .field.success .ui.dropdown:hover .menu { - border-color: #A3C293; -} - -.ui.form .fields.success .field .ui.multiple.selection.dropdown > .label, -.ui.form .field.success .ui.multiple.selection.dropdown > .label { - background-color: #cceacc; - color: #2C662D; -} - -/* Hover */ - -.ui.form .fields.success .field .ui.dropdown .menu .item:hover, -.ui.form .field.success .ui.dropdown .menu .item:hover { - background-color: #e9fbe9; -} - -/* Selected */ - -.ui.form .fields.success .field .ui.dropdown .menu .selected.item, -.ui.form .field.success .ui.dropdown .menu .selected.item { - background-color: #e9fbe9; -} - -/* Active */ - -.ui.form .fields.success .field .ui.dropdown .menu .active.item, -.ui.form .field.success .ui.dropdown .menu .active.item { - background-color: #dafdce !important; -} - -/*-------------------- - Checkbox State - ---------------------*/ - -.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label, -.ui.form .field.success .checkbox:not(.toggle):not(.slider) label, -.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) .box, -.ui.form .field.success .checkbox:not(.toggle):not(.slider) .box { - color: #2C662D; -} - -.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .field.success .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) .box:before, -.ui.form .field.success .checkbox:not(.toggle):not(.slider) .box:before { - background: #FCFFF5; - border-color: #A3C293; -} - -.ui.form .fields.success .field .checkbox label:after, -.ui.form .field.success .checkbox label:after, -.ui.form .fields.success .field .checkbox .box:after, -.ui.form .field.success .checkbox .box:after { - color: #2C662D; -} - -.ui.inverted.form .fields.success .field label, -.ui.inverted.form .success.field label { - color: #b9d1ad; -} - -/* On Form */ - -.ui.form.warning .warning.message:not(:empty) { - display: block; -} - -.ui.form.warning .compact.warning.message:not(:empty) { - display: inline-block; -} - -.ui.form.warning .icon.warning.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -/* On Field(s) */ - -.ui.form .fields.warning .warning.message:not(:empty), -.ui.form .field.warning .warning.message:not(:empty) { - display: block; -} - -.ui.form .fields.warning .compact.warning.message:not(:empty), -.ui.form .field.warning .compact.warning.message:not(:empty) { - display: inline-block; -} - -.ui.form .fields.warning .icon.warning.message:not(:empty), -.ui.form .field.warning .icon.warning.message:not(:empty) { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.ui.ui.form .fields.warning .field label, -.ui.ui.form .fields.warning .field .ui.label:not(.corner), -.ui.ui.form .field.warning label, -.ui.ui.form .field.warning .ui.label:not(.corner), -.ui.ui.form .fields.warning .field .input, -.ui.ui.form .field.warning .input { - color: #573A08; -} - -.ui.form .fields.warning .field .ui.label, -.ui.form .field.warning .ui.label { - background-color: #d7ccb5; -} - -.ui.form .fields.warning .field .corner.label, -.ui.form .field.warning .corner.label { - border-color: #573A08; - color: #FFFFFF; -} - -.ui.form .fields.warning .field textarea, -.ui.form .fields.warning .field select, -.ui.form .fields.warning .field input:not([type]), -.ui.form .fields.warning .field input[type="date"], -.ui.form .fields.warning .field input[type="datetime-local"], -.ui.form .fields.warning .field input[type="email"], -.ui.form .fields.warning .field input[type="number"], -.ui.form .fields.warning .field input[type="password"], -.ui.form .fields.warning .field input[type="search"], -.ui.form .fields.warning .field input[type="tel"], -.ui.form .fields.warning .field input[type="time"], -.ui.form .fields.warning .field input[type="text"], -.ui.form .fields.warning .field input[type="file"], -.ui.form .fields.warning .field input[type="url"], -.ui.form .field.warning textarea, -.ui.form .field.warning select, -.ui.form .field.warning input:not([type]), -.ui.form .field.warning input[type="date"], -.ui.form .field.warning input[type="datetime-local"], -.ui.form .field.warning input[type="email"], -.ui.form .field.warning input[type="number"], -.ui.form .field.warning input[type="password"], -.ui.form .field.warning input[type="search"], -.ui.form .field.warning input[type="tel"], -.ui.form .field.warning input[type="time"], -.ui.form .field.warning input[type="text"], -.ui.form .field.warning input[type="file"], -.ui.form .field.warning input[type="url"] { - color: #573A08; - background: #FFFAF3; - border-color: #C9BA9B; - border-radius: ''; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.form .field.warning textarea:focus, -.ui.form .field.warning select:focus, -.ui.form .field.warning input:not([type]):focus, -.ui.form .field.warning input[type="date"]:focus, -.ui.form .field.warning input[type="datetime-local"]:focus, -.ui.form .field.warning input[type="email"]:focus, -.ui.form .field.warning input[type="number"]:focus, -.ui.form .field.warning input[type="password"]:focus, -.ui.form .field.warning input[type="search"]:focus, -.ui.form .field.warning input[type="tel"]:focus, -.ui.form .field.warning input[type="time"]:focus, -.ui.form .field.warning input[type="text"]:focus, -.ui.form .field.warning input[type="file"]:focus, -.ui.form .field.warning input[type="url"]:focus { - background: #FFFAF3; - border-color: #C9BA9B; - color: #573A08; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Preserve Native Select Stylings */ - -.ui.form .field.warning select { - -webkit-appearance: menulist-button; -} - -/*------------------ - Input State - --------------------*/ - -/* Transparent */ - -.ui.form .field.warning .transparent.input input, -.ui.form .field.warning .transparent.input textarea, -.ui.form .field.warning input.transparent, -.ui.form .field.warning textarea.transparent { - background-color: #FFFAF3 !important; - color: #573A08 !important; -} - -/* Autofilled */ - -.ui.form .warning.warning input:-webkit-autofill { - -webkit-box-shadow: 0 0 0 100px #FFFFe0 inset !important; - box-shadow: 0 0 0 100px #FFFFe0 inset !important; - border-color: #e0e0b3 !important; -} - -/* Placeholder */ - -.ui.form .warning ::-webkit-input-placeholder { - color: #edad3e; -} - -.ui.form .warning :-ms-input-placeholder { - color: #edad3e !important; -} - -.ui.form .warning ::-moz-placeholder { - color: #edad3e; -} - -.ui.form .warning :focus::-webkit-input-placeholder { - color: #e39715; -} - -.ui.form .warning :focus:-ms-input-placeholder { - color: #e39715 !important; -} - -.ui.form .warning :focus::-moz-placeholder { - color: #e39715; -} - -/*------------------ - Dropdown State - --------------------*/ - -.ui.form .fields.warning .field .ui.dropdown, -.ui.form .fields.warning .field .ui.dropdown .item, -.ui.form .field.warning .ui.dropdown, -.ui.form .field.warning .ui.dropdown > .text, -.ui.form .field.warning .ui.dropdown .item { - background: #FFFAF3; - color: #573A08; -} - -.ui.form .fields.warning .field .ui.dropdown, -.ui.form .field.warning .ui.dropdown { - border-color: #C9BA9B !important; -} - -.ui.form .fields.warning .field .ui.dropdown:hover, -.ui.form .field.warning .ui.dropdown:hover { - border-color: #C9BA9B !important; -} - -.ui.form .fields.warning .field .ui.dropdown:hover .menu, -.ui.form .field.warning .ui.dropdown:hover .menu { - border-color: #C9BA9B; -} - -.ui.form .fields.warning .field .ui.multiple.selection.dropdown > .label, -.ui.form .field.warning .ui.multiple.selection.dropdown > .label { - background-color: #eaeacc; - color: #573A08; -} - -/* Hover */ - -.ui.form .fields.warning .field .ui.dropdown .menu .item:hover, -.ui.form .field.warning .ui.dropdown .menu .item:hover { - background-color: #fbfbe9; -} - -/* Selected */ - -.ui.form .fields.warning .field .ui.dropdown .menu .selected.item, -.ui.form .field.warning .ui.dropdown .menu .selected.item { - background-color: #fbfbe9; -} - -/* Active */ - -.ui.form .fields.warning .field .ui.dropdown .menu .active.item, -.ui.form .field.warning .ui.dropdown .menu .active.item { - background-color: #fdfdce !important; -} - -/*-------------------- - Checkbox State - ---------------------*/ - -.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label, -.ui.form .field.warning .checkbox:not(.toggle):not(.slider) label, -.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) .box, -.ui.form .field.warning .checkbox:not(.toggle):not(.slider) .box { - color: #573A08; -} - -.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .field.warning .checkbox:not(.toggle):not(.slider) label:before, -.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) .box:before, -.ui.form .field.warning .checkbox:not(.toggle):not(.slider) .box:before { - background: #FFFAF3; - border-color: #C9BA9B; -} - -.ui.form .fields.warning .field .checkbox label:after, -.ui.form .field.warning .checkbox label:after, -.ui.form .fields.warning .field .checkbox .box:after, -.ui.form .field.warning .checkbox .box:after { - color: #573A08; -} - -.ui.inverted.form .fields.warning .field label, -.ui.inverted.form .warning.field label { - color: #d7ccb5; -} - -/*-------------------- - Disabled - ---------------------*/ - -.ui.form .disabled.fields .field, -.ui.form .disabled.field, -.ui.form .field :disabled { - pointer-events: none; - opacity: 0.45; -} - -.ui.form .field.disabled > label, -.ui.form .fields.disabled > label { - opacity: 0.45; -} - -.ui.form .field.disabled :disabled { - opacity: 1; -} - -/*-------------- - Loading - ---------------*/ - -.ui.loading.form { - position: relative; - cursor: default; - pointer-events: none; -} - -.ui.loading.form:before { - position: absolute; - content: ''; - top: 0; - left: 0; - background: rgba(255, 255, 255, 0.8); - width: 100%; - height: 100%; - z-index: 100; -} - -.ui.loading.form.segments:before { - border-radius: 0.33333333rem; -} - -.ui.loading.form:after { - position: absolute; - content: ''; - top: 50%; - left: 50%; - margin: -1.5em 0 0 -1.5em; - width: 3em; - height: 3em; - -webkit-animation: loader 0.6s infinite linear; - animation: loader 0.6s infinite linear; - border: 0.2em solid #767676; - border-radius: 500rem; - -webkit-box-shadow: 0 0 0 1px transparent; - box-shadow: 0 0 0 1px transparent; - visibility: visible; - z-index: 101; -} - -/******************************* - Element Types -*******************************/ - -/*-------------------- - Required Field - ---------------------*/ - -.ui.form .required.fields:not(.grouped) > .field > label:after, -.ui.form .required.fields.grouped > label:after, -.ui.form .required.field > label:after, -.ui.form .required.fields:not(.grouped) > .field > .checkbox:after, -.ui.form .required.field > .checkbox:after, -.ui.form label.required:after { - margin: -0.2em 0 0 0.2em; - content: '*'; - color: #DB2828; -} - -.ui.form .required.fields:not(.grouped) > .field > label:after, -.ui.form .required.fields.grouped > label:after, -.ui.form .required.field > label:after, -.ui.form label.required:after { - display: inline-block; - vertical-align: top; -} - -.ui.form .required.fields:not(.grouped) > .field > .checkbox:after, -.ui.form .required.field > .checkbox:after { - position: absolute; - top: 0; - left: 100%; -} - -/******************************* - Variations -*******************************/ - -/*-------------------- - Inverted Colors - ---------------------*/ - -.ui.inverted.form label, -.ui.form .inverted.segment label, -.ui.form .inverted.segment .ui.checkbox label, -.ui.form .inverted.segment .ui.checkbox .box, -.ui.inverted.form .ui.checkbox label, -.ui.inverted.form .ui.checkbox .box, -.ui.inverted.form .inline.fields > label, -.ui.inverted.form .inline.fields .field > label, -.ui.inverted.form .inline.fields .field > p, -.ui.inverted.form .inline.field > label, -.ui.inverted.form .inline.field > p { - color: rgba(255, 255, 255, 0.9); -} - -.ui.inverted.loading.form { - color: #FFFFFF; -} - -.ui.inverted.loading.form:before { - background: rgba(0, 0, 0, 0.85); -} - -/* Inverted Field */ - -.ui.inverted.form input:not([type]), -.ui.inverted.form input[type="date"], -.ui.inverted.form input[type="datetime-local"], -.ui.inverted.form input[type="email"], -.ui.inverted.form input[type="number"], -.ui.inverted.form input[type="password"], -.ui.inverted.form input[type="search"], -.ui.inverted.form input[type="tel"], -.ui.inverted.form input[type="time"], -.ui.inverted.form input[type="text"], -.ui.inverted.form input[type="file"], -.ui.inverted.form input[type="url"] { - background: #FFFFFF; - border-color: rgba(255, 255, 255, 0.1); - color: rgba(0, 0, 0, 0.87); - -webkit-box-shadow: none; - box-shadow: none; -} - -/*-------------------- - Field Groups - ---------------------*/ - -/* Grouped Vertically */ - -.ui.form .grouped.fields { - display: block; - margin: 0 0 1em; -} - -.ui.form .grouped.fields:last-child { - margin-bottom: 0; -} - -.ui.form .grouped.fields > label { - margin: 0 0 0.33333333rem 0; - color: rgba(0, 0, 0, 0.87); - font-size: 0.91666667em; - font-weight: bold; - text-transform: none; -} - -.ui.form .grouped.fields .field, -.ui.form .grouped.inline.fields .field { - display: block; - margin: 0.5em 0; - padding: 0; -} - -.ui.form .grouped.inline.fields .ui.checkbox { - margin-bottom: 0.4em; -} - -/*-------------------- - Fields ----------------------*/ - -/* Split fields */ - -.ui.form .fields { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - margin: 0 -0.5em 1em; -} - -.ui.form .fields > .field { - -webkit-box-flex: 0; - -ms-flex: 0 1 auto; - flex: 0 1 auto; - padding-left: 0.5em; - padding-right: 0.5em; -} - -.ui.form .fields > .field:first-child { - border-left: none; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Other Combinations */ - -.ui.form .two.fields > .fields, -.ui.form .two.fields > .field { - width: 50%; -} - -.ui.form .three.fields > .fields, -.ui.form .three.fields > .field { - width: 33.33333333%; -} - -.ui.form .four.fields > .fields, -.ui.form .four.fields > .field { - width: 25%; -} - -.ui.form .five.fields > .fields, -.ui.form .five.fields > .field { - width: 20%; -} - -.ui.form .six.fields > .fields, -.ui.form .six.fields > .field { - width: 16.66666667%; -} - -.ui.form .seven.fields > .fields, -.ui.form .seven.fields > .field { - width: 14.28571429%; -} - -.ui.form .eight.fields > .fields, -.ui.form .eight.fields > .field { - width: 12.5%; -} - -.ui.form .nine.fields > .fields, -.ui.form .nine.fields > .field { - width: 11.11111111%; -} - -.ui.form .ten.fields > .fields, -.ui.form .ten.fields > .field { - width: 10%; -} - -/* Swap to full width on mobile */ - -@media only screen and (max-width: 767.98px) { - .ui.form .fields { - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin-bottom: 0; - } - - .ui.form:not(.unstackable) .fields:not(.unstackable) > .fields, - .ui.form:not(.unstackable) .fields:not(.unstackable) > .field { - width: 100%; - margin: 0 0 1em; - } -} - -/* Sizing Combinations */ - -.ui.form .fields .wide.field { - width: 6.25%; - padding-left: 0.5em; - padding-right: 0.5em; -} - -.ui.form .one.wide.field { - width: 6.25%; -} - -.ui.form .two.wide.field { - width: 12.5%; -} - -.ui.form .three.wide.field { - width: 18.75%; -} - -.ui.form .four.wide.field { - width: 25%; -} - -.ui.form .five.wide.field { - width: 31.25%; -} - -.ui.form .six.wide.field { - width: 37.5%; -} - -.ui.form .seven.wide.field { - width: 43.75%; -} - -.ui.form .eight.wide.field { - width: 50%; -} - -.ui.form .nine.wide.field { - width: 56.25%; -} - -.ui.form .ten.wide.field { - width: 62.5%; -} - -.ui.form .eleven.wide.field { - width: 68.75%; -} - -.ui.form .twelve.wide.field { - width: 75%; -} - -.ui.form .thirteen.wide.field { - width: 81.25%; -} - -.ui.form .fourteen.wide.field { - width: 87.5%; -} - -.ui.form .fifteen.wide.field { - width: 93.75%; -} - -.ui.form .sixteen.wide.field { - width: 100%; -} - -/*-------------------- - Equal Width ----------------------*/ - -.ui[class*="equal width"].form .fields > .field, -.ui.form [class*="equal width"].fields > .field { - width: 100%; - -webkit-box-flex: 1; - -ms-flex: 1 1 auto; - flex: 1 1 auto; -} - -/*-------------------- - Inline Fields - ---------------------*/ - -.ui.form .inline.fields { - margin: 0 0 1em; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.ui.form .inline.fields .field { - margin: 0; - padding: 0 1em 0 0; -} - -/* Inline Label */ - -.ui.form .inline.fields > label, -.ui.form .inline.fields .field > label, -.ui.form .inline.fields .field > p, -.ui.form .inline.field > label, -.ui.form .inline.field > p { - display: inline-block; - width: auto; - margin-top: 0; - margin-bottom: 0; - vertical-align: baseline; - font-size: 0.91666667em; - font-weight: bold; - color: rgba(0, 0, 0, 0.87); - text-transform: none; -} - -/* Grouped Inline Label */ - -.ui.form .inline.fields > label { - margin: 0.035714em 1em 0 0; -} - -/* Inline Input */ - -.ui.form .inline.fields .field > input, -.ui.form .inline.fields .field > select, -.ui.form .inline.field > input, -.ui.form .inline.field > select { - display: inline-block; - width: auto; - margin-top: 0; - margin-bottom: 0; - vertical-align: middle; - font-size: 1em; -} - -.ui.form .inline.fields .field .calendar:not(.popup), -.ui.form .inline.field .calendar:not(.popup) { - display: inline-block; -} - -.ui.form .inline.fields .field .calendar:not(.popup) > .input > input, -.ui.form .inline.field .calendar:not(.popup) > .input > input { - width: 13.11em; -} - -/* Label */ - -.ui.form .inline.fields .field > :first-child, -.ui.form .inline.field > :first-child { - margin: 0 0.83333333em 0 0; -} - -.ui.form .inline.fields .field > :only-child, -.ui.form .inline.field > :only-child { - margin: 0; -} - -/* Wide */ - -.ui.form .inline.fields .wide.field { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.ui.form .inline.fields .wide.field > input, -.ui.form .inline.fields .wide.field > select { - width: 100%; -} - -/*-------------------- - Sizes ----------------------*/ - -.ui.form, -.ui.form .field .dropdown, -.ui.form .field .dropdown .menu > .item { - font-size: 1rem; -} - -.ui.mini.form, -.ui.mini.form .field .dropdown, -.ui.mini.form .field .dropdown .menu > .item { - font-size: 0.75rem; -} - -.ui.tiny.form, -.ui.tiny.form .field .dropdown, -.ui.tiny.form .field .dropdown .menu > .item { - font-size: 0.83333333rem; -} - -.ui.small.form, -.ui.small.form .field .dropdown, -.ui.small.form .field .dropdown .menu > .item { - font-size: 0.91666667rem; -} - -.ui.large.form, -.ui.large.form .field .dropdown, -.ui.large.form .field .dropdown .menu > .item { - font-size: 1.16666667rem; -} - -.ui.big.form, -.ui.big.form .field .dropdown, -.ui.big.form .field .dropdown .menu > .item { - font-size: 1.25rem; -} - -.ui.huge.form, -.ui.huge.form .field .dropdown, -.ui.huge.form .field .dropdown .menu > .item { - font-size: 1.41666667rem; -} - -.ui.massive.form, -.ui.massive.form .field .dropdown, -.ui.massive.form .field .dropdown .menu > .item { - font-size: 1.75rem; -} - -/******************************* - Theme Overrides -*******************************/ - -/******************************* - Site Overrides -*******************************/ -/* - * # Fomantic - Menu - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Copyright 2015 Contributor - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Standard -*******************************/ - -/*-------------- - Menu ----------------*/ - -.ui.menu { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - margin: 1rem 0; - font-family: 'Raleway', sans-serif; - background: #FFFFFF; - font-weight: normal; - border: 1px solid rgba(34, 36, 38, 0.15); - -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); - border-radius: 0.33333333rem; - min-height: 2.83333333em; -} - -.ui.menu:after { - content: ''; - display: block; - height: 0; - clear: both; - visibility: hidden; -} - -.ui.menu:first-child { - margin-top: 0; -} - -.ui.menu:last-child { - margin-bottom: 0; -} - -/*-------------- - Sub-Menu ----------------*/ - -.ui.menu .menu { - margin: 0; -} - -.ui.menu:not(.vertical) > .menu { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -/*-------------- - Item ----------------*/ - -.ui.menu:not(.vertical) .item { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.ui.menu .item { - position: relative; - vertical-align: middle; - line-height: 1; - text-decoration: none; - -webkit-tap-highlight-color: transparent; - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - background: none; - padding: 0.91666667em 1.16666667em; - text-transform: none; - color: rgba(0, 0, 0, 0.87); - font-weight: normal; - -webkit-transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; - transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; - transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease; - transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; -} - -.ui.menu > .item:first-child { - border-radius: 0.33333333rem 0 0 0.33333333rem; -} - -/* Border */ - -.ui.menu .item:before { - position: absolute; - content: ''; - top: 0; - right: 0; - height: 100%; - width: 1px; - background: rgba(34, 36, 38, 0.1); -} - -/*-------------- - Text Content ----------------*/ - -.ui.menu .text.item > *, -.ui.menu .item > a:not(.ui), -.ui.menu .item > p:only-child { - -webkit-user-select: text; - -moz-user-select: text; - -ms-user-select: text; - user-select: text; - line-height: 1.3; -} - -.ui.menu .item > p:first-child { - margin-top: 0; -} - -.ui.menu .item > p:last-child { - margin-bottom: 0; -} - -/*-------------- - Icons ----------------*/ - -.ui.menu .item > i.icon { - opacity: 0.9; - float: none; - margin: 0 0.41666667em 0 0; -} - -/*-------------- - Button ----------------*/ - -.ui.menu:not(.vertical) .item > .button { - position: relative; - top: 0; - margin: -0.5em 0; - padding-bottom: 0.75em; - padding-top: 0.75em; - font-size: 1em; -} - -/*---------------- - Grid / Container ------------------*/ - -.ui.menu > .grid, -.ui.menu > .container { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: inherit; - -ms-flex-align: inherit; - align-items: inherit; - -webkit-box-orient: inherit; - -webkit-box-direction: inherit; - -ms-flex-direction: inherit; - flex-direction: inherit; -} - -/*-------------- - Inputs ----------------*/ - -.ui.menu .item > .input { - width: 100%; -} - -.ui.menu:not(.vertical) .item > .input { - position: relative; - top: 0; - margin: -0.5em 0; -} - -.ui.menu .item > .input input { - font-size: 1em; - padding-top: 0.66666667em; - padding-bottom: 0.66666667em; -} - -/*-------------- - Header ----------------*/ - -.ui.menu .header.item, -.ui.vertical.menu .header.item { - margin: 0; - background: ''; - text-transform: normal; - font-weight: bold; -} - -.ui.vertical.menu .item > .header:not(.ui) { - margin: 0 0 0.5em; - font-size: 1em; - font-weight: bold; -} - -/*-------------- - Dropdowns ----------------*/ - -/* Dropdown Icon */ - -.ui.menu .item > i.dropdown.icon { - padding: 0; - float: right; - margin: 0 0 0 1em; -} - -/* Menu */ - -.ui.menu .dropdown.item .menu { - min-width: calc(100% - 1px); - border-radius: 0 0 0.33333333rem 0.33333333rem; - background: #FFFFFF; - margin: 0 0 0; - -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); - box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); -} - -.ui.menu .dropdown.item:not(.column) .menu { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; -} - -/* Menu Items */ - -.ui.menu .ui.dropdown .menu > .item { - margin: 0; - text-align: left; - font-size: 1em !important; - padding: 0.75em 1.16666667em !important; - background: transparent !important; - color: rgba(0, 0, 0, 0.87) !important; - text-transform: none !important; - font-weight: normal !important; - -webkit-box-shadow: none !important; - box-shadow: none !important; - -webkit-transition: none !important; - transition: none !important; -} - -.ui.menu .ui.dropdown .menu > .item:hover { - background: rgba(0, 0, 0, 0.05) !important; - color: rgba(0, 0, 0, 0.95) !important; -} - -.ui.menu .ui.dropdown .menu > .selected.item { - background: rgba(0, 0, 0, 0.05) !important; - color: rgba(0, 0, 0, 0.95) !important; -} - -.ui.menu .ui.dropdown .menu > .active.item { - background: rgba(0, 0, 0, 0.03) !important; - font-weight: bold !important; - color: rgba(0, 0, 0, 0.95) !important; -} - -.ui.menu .ui.dropdown.item .menu .item:not(.filtered) { - display: block; -} - -.ui.menu .ui.dropdown .menu > .item > .icons, -.ui.menu .ui.dropdown .menu > .item > i.icon:not(.dropdown) { - display: inline-block; - font-size: 1em !important; - float: none; - margin: 0 0.75em 0 0 !important; -} - -/* Secondary */ - -.ui.secondary.menu .dropdown.item > .menu, -.ui.text.menu .dropdown.item > .menu { - border-radius: 0.33333333rem; - margin-top: 0.41666667em; -} - -/* Pointing */ - -.ui.menu .pointing.dropdown.item .menu { - margin-top: 0.75em; -} - -/* Inverted */ - -.ui.inverted.menu .search.dropdown.item > .search, -.ui.inverted.menu .search.dropdown.item > .text { - color: rgba(255, 255, 255, 0.9); -} - -/* Vertical */ - -.ui.vertical.menu .dropdown.item > i.icon { - float: right; - content: "\f0da"; - margin-left: 1em; -} - -.ui.vertical.menu .dropdown.item .menu { - left: 100%; - /* IE needs 0, all others support max-content to show dropdown icon inline, so keep both settings! */ - min-width: 0; - min-width: -webkit-max-content; - min-width: -moz-max-content; - min-width: max-content; - margin: 0 0 0 0; - -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); - box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); - border-radius: 0 0.33333333rem 0.33333333rem 0.33333333rem; -} - -.ui.vertical.menu .dropdown.item.upward .menu { - bottom: 0; -} - -.ui.vertical.menu .dropdown.item:not(.upward) .menu { - top: 0; -} - -.ui.vertical.menu .active.dropdown.item { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.ui.vertical.menu .dropdown.active.item { - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Evenly Divided */ - -.ui.item.menu .dropdown .menu .item { - width: 100%; -} - -/*-------------- - Labels ----------------*/ - -.ui.menu .item > .label:not(.floating) { - margin-left: 1em; - padding: 0.3em 0.75em; -} - -.ui.vertical.menu .item > .label { - margin-top: -0.15em; - margin-bottom: -0.15em; - padding: 0.3em 0.75em; -} - -.ui.menu .item > .floating.label { - padding: 0.3em 0.75em; -} - -.ui.menu .item > .label { - background: #999999; - color: #FFFFFF; -} - -.ui.menu .item > .image.label img { - margin: -0.2833em 0.8em -0.2833em -0.8em; - height: 1.5666em; -} - -/*-------------- - Images ----------------*/ - -.ui.menu .item > img:not(.ui) { - display: inline-block; - vertical-align: middle; - margin: -0.3em 0; - width: 2.5em; -} - -.ui.vertical.menu .item > img:not(.ui):only-child { - display: block; - max-width: 100%; - width: auto; -} - -/******************************* - Coupling -*******************************/ - -/*-------------- - List ----------------*/ - -/* Menu divider shouldnt apply */ - -.ui.menu .list .item:before { - background: none !important; -} - -/*-------------- - Sidebar - ---------------*/ - -/* Show vertical dividers below last */ - -.ui.vertical.sidebar.menu > .item:first-child:before { - display: block !important; -} - -.ui.vertical.sidebar.menu > .item::before { - top: auto; - bottom: 0; -} - -/*-------------- - Container ----------------*/ - -@media only screen and (max-width: 767.98px) { - .ui.menu > .ui.container { - width: 100% !important; - margin-left: 0 !important; - margin-right: 0 !important; - } -} - -@media only screen and (min-width: 768px) { - .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .item:not(.right):not(.borderless):first-child { - border-left: 1px solid rgba(34, 36, 38, 0.1); - } - - .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .right.item:not(.borderless):last-child, - .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .right.menu > .item:not(.borderless):last-child { - border-right: 1px solid rgba(34, 36, 38, 0.1); - } -} - -/******************************* - States -*******************************/ - -/*-------------- - Hover ----------------*/ - -.ui.link.menu .item:hover, -.ui.menu .dropdown.item:hover, -.ui.menu .link.item:hover, -.ui.menu a.item:hover { - cursor: pointer; - background: rgba(0, 0, 0, 0.03); - color: rgba(0, 0, 0, 0.95); -} - -/*-------------- - Pressed ----------------*/ - -.ui.link.menu .item:active, -.ui.menu .link.item:active, -.ui.menu a.item:active { - background: rgba(0, 0, 0, 0.03); - color: rgba(0, 0, 0, 0.95); -} - -/*-------------- - Active ----------------*/ - -.ui.menu .active.item { - background: rgba(0, 0, 0, 0.05); - color: rgba(0, 0, 0, 0.95); - font-weight: normal; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.menu .active.item > i.icon { - opacity: 1; -} - -/*-------------- - Active Hover ----------------*/ - -.ui.menu .active.item:hover, -.ui.vertical.menu .active.item:hover { - background-color: rgba(0, 0, 0, 0.05); - color: rgba(0, 0, 0, 0.95); -} - -/*-------------- - Disabled ----------------*/ - -.ui.ui.menu .item.disabled { - cursor: default; - background-color: transparent; - color: rgba(40, 40, 40, 0.3); - pointer-events: none; -} - -/******************************* - Types -*******************************/ - -/*------------------ -Floated Menu / Item --------------------*/ - -/* Left Floated */ - -.ui.menu:not(.vertical) .left.item, -.ui.menu:not(.vertical) .left.menu { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - margin-right: auto !important; -} - -/* Right Floated */ - -.ui.menu:not(.vertical) .right.item, -.ui.menu:not(.vertical) .right.menu { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - margin-left: auto !important; -} - -.ui.menu:not(.vertical) :not(.dropdown) > .left.menu, -.ui.menu:not(.vertical) :not(.dropdown) > .right.menu { - display: inherit; -} - -/* Center */ - -.ui.menu:not(.vertical) .center.item, -.ui.menu:not(.vertical) .center.menu { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - margin-left: auto !important; - margin-right: auto !important; -} - -/* Swapped Borders */ - -.ui.menu .right.item::before, -.ui.menu .right.menu > .item::before { - right: auto; - left: 0; -} - -/* Remove Outer Borders */ - -.ui.menu .center.item:last-child::before, -.ui.menu .center.menu > .item:last-child::before { - display: none; -} - -/*-------------- - Vertical - ---------------*/ - -.ui.vertical.menu { - display: block; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - background: #FFFFFF; - -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); -} - -/*--- Item ---*/ - -.ui.vertical.menu .item { - display: block; - background: none; - border-top: none; - border-right: none; -} - -.ui.vertical.menu > .item:first-child { - border-radius: 0.33333333rem 0.33333333rem 0 0; -} - -.ui.vertical.menu > .item:last-child { - border-radius: 0 0 0.33333333rem 0.33333333rem; -} - -/*--- Label ---*/ - -.ui.vertical.menu .item > .label { - float: right; - text-align: center; -} - -/*--- Icon ---*/ - -.ui.vertical.menu .item > i.icon, -.ui.vertical.menu .item > i.icons { - width: 1.18em; - float: right; - margin: 0 0 0 0.5em; -} - -.ui.vertical.menu .item > .label + i.icon { - float: none; - margin: 0 0.5em 0 0; -} - -/*--- Border ---*/ - -.ui.vertical.menu .item:before { - position: absolute; - content: ''; - top: 0; - left: 0; - width: 100%; - height: 1px; - background: rgba(34, 36, 38, 0.1); -} - -.ui.vertical.menu .item:first-child:before { - display: none !important; -} - -/*--- Sub Menu ---*/ - -.ui.vertical.menu .item > .menu { - margin: 0.5em -1.16666667em 0; -} - -.ui.vertical.menu .menu .item { - background: none; - padding: 0.5em 1.36111111em; - font-size: 0.83333333em; - color: rgba(0, 0, 0, 0.5); -} - -.ui.vertical.menu .item .menu a.item:hover, -.ui.vertical.menu .item .menu .link.item:hover { - color: rgba(0, 0, 0, 0.85); -} - -.ui.vertical.menu .menu .item:before { - display: none; -} - -/* Vertical Active */ - -.ui.vertical.menu .active.item { - background: rgba(0, 0, 0, 0.05); - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.vertical.menu > .active.item:first-child { - border-radius: 0.33333333rem 0.33333333rem 0 0; -} - -.ui.vertical.menu > .active.item:last-child { - border-radius: 0 0 0.33333333rem 0.33333333rem; -} - -.ui.vertical.menu > .active.item:only-child { - border-radius: 0.33333333rem; -} - -.ui.vertical.menu .active.item .menu .active.item { - border-left: none; -} - -.ui.vertical.menu .item .menu .active.item { - background-color: transparent; - font-weight: bold; - color: rgba(0, 0, 0, 0.95); -} - -/*-------------- - Tabular - ---------------*/ - -.ui.tabular.menu { - border-radius: 0; - -webkit-box-shadow: none !important; - box-shadow: none !important; - border: none; - background: none transparent; - border-bottom: 1px solid #D4D4D5; -} - -.ui.tabular.fluid.menu { - width: calc(100% + 2px) !important; -} - -.ui.tabular.menu .item { - background: transparent; - border-bottom: none; - border-left: 1px solid transparent; - border-right: 1px solid transparent; - border-top: 2px solid transparent; - padding: 0.91666667em 1.41666667em; - color: rgba(0, 0, 0, 0.87); -} - -.ui.tabular.menu .item:before { - display: none; -} - -/* Hover */ - -.ui.tabular.menu .item:hover { - background-color: transparent; - color: rgba(0, 0, 0, 0.8); -} - -/* Active */ - -.ui.tabular.menu .active.item { - background: none #FFFFFF; - color: rgba(0, 0, 0, 0.95); - border-top-width: 1px; - border-color: #D4D4D5; - font-weight: bold; - margin-bottom: -1px; - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0.33333333rem 0.33333333rem 0 0 !important; -} - -/* Coupling with segment for attachment */ - -.ui.tabular.menu + .attached:not(.top).segment, -.ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment { - border-top: none; - margin-left: 0; - margin-top: 0; - margin-right: 0; - width: 100%; -} - -.top.attached.segment + .ui.bottom.tabular.menu { - position: relative; - width: calc(100% + 2px); - left: -1px; -} - -/* Bottom Vertical Tabular */ - -.ui.bottom.tabular.menu { - background: none transparent; - border-radius: 0; - -webkit-box-shadow: none !important; - box-shadow: none !important; - border-bottom: none; - border-top: 1px solid #D4D4D5; -} - -.ui.bottom.tabular.menu .item { - background: none; - border-left: 1px solid transparent; - border-right: 1px solid transparent; - border-bottom: 1px solid transparent; - border-top: none; -} - -.ui.bottom.tabular.menu .active.item { - background: none #FFFFFF; - color: rgba(0, 0, 0, 0.95); - border-color: #D4D4D5; - margin: -1px 0 0 0; - border-radius: 0 0 0.33333333rem 0.33333333rem !important; -} - -/* Vertical Tabular (Left) */ - -.ui.vertical.tabular.menu { - background: none transparent; - border-radius: 0; - -webkit-box-shadow: none !important; - box-shadow: none !important; - border-bottom: none; - border-right: 1px solid #D4D4D5; -} - -.ui.vertical.tabular.menu .item { - background: none; - border-left: 1px solid transparent; - border-bottom: 1px solid transparent; - border-top: 1px solid transparent; - border-right: none; -} - -.ui.vertical.tabular.menu .active.item { - background: none #FFFFFF; - color: rgba(0, 0, 0, 0.95); - border-color: #D4D4D5; - margin: 0 -1px 0 0; - border-radius: 0.33333333rem 0 0 0.33333333rem !important; -} - -/* Vertical Right Tabular */ - -.ui.vertical.right.tabular.menu { - background: none transparent; - border-radius: 0; - -webkit-box-shadow: none !important; - box-shadow: none !important; - border-bottom: none; - border-right: none; - border-left: 1px solid #D4D4D5; -} - -.ui.vertical.right.tabular.menu .item { - background: none; - border-right: 1px solid transparent; - border-bottom: 1px solid transparent; - border-top: 1px solid transparent; - border-left: none; -} - -.ui.vertical.right.tabular.menu .active.item { - background: none #FFFFFF; - color: rgba(0, 0, 0, 0.95); - border-color: #D4D4D5; - margin: 0 0 0 -1px; - border-radius: 0 0.33333333rem 0.33333333rem 0 !important; -} - -/* Dropdown */ - -.ui.tabular.menu .active.dropdown.item { - margin-bottom: 0; - border-left: 1px solid transparent; - border-right: 1px solid transparent; - border-top: 2px solid transparent; - border-bottom: none; -} - -/*-------------- - Pagination - ---------------*/ - -.ui.pagination.menu { - margin: 0; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - vertical-align: middle; -} - -.ui.pagination.menu .item:last-child { - border-radius: 0 0.33333333rem 0.33333333rem 0; -} - -.ui.compact.menu .item:last-child { - border-radius: 0 0.33333333rem 0.33333333rem 0; -} - -.ui.pagination.menu .item:last-child:before { - display: none; -} - -.ui.pagination.menu .item { - min-width: 3em; - text-align: center; -} - -.ui.pagination.menu .icon.item i.icon { - vertical-align: top; -} - -/* Active */ - -.ui.pagination.menu .active.item { - border-top: none; - padding-top: 0.91666667em; - background-color: rgba(0, 0, 0, 0.05); - color: rgba(0, 0, 0, 0.95); - -webkit-box-shadow: none; - box-shadow: none; -} - -/*-------------- - Secondary - ---------------*/ - -.ui.secondary.menu { - background: none; - margin-left: -0.41666667em; - margin-right: -0.41666667em; - border-radius: 0; - border: none; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Item */ - -.ui.secondary.menu .item { - -ms-flex-item-align: center; - align-self: center; - -webkit-box-shadow: none; - box-shadow: none; - border: none; - padding: 0.75em 0.91666667em; - margin: 0 0.41666667em; - background: none; - -webkit-transition: color 0.1s ease; - transition: color 0.1s ease; - border-radius: 0.33333333rem; -} - -/* No Divider */ - -.ui.secondary.menu .item:before { - display: none !important; -} - -/* Header */ - -.ui.secondary.menu .header.item { - border-radius: 0; - border-right: none; - background: none transparent; -} - -/* Image */ - -.ui.secondary.menu .item > img:not(.ui) { - margin: 0; -} - -/* Hover */ - -.ui.secondary.menu .dropdown.item:hover, -.ui.secondary.menu .link.item:hover, -.ui.secondary.menu a.item:hover { - background: rgba(0, 0, 0, 0.05); - color: rgba(0, 0, 0, 0.95); -} - -/* Active */ - -.ui.secondary.menu .active.item { - -webkit-box-shadow: none; - box-shadow: none; - background: rgba(0, 0, 0, 0.05); - color: rgba(0, 0, 0, 0.95); - border-radius: 0.33333333rem; -} - -/* Active Hover */ - -.ui.secondary.menu .active.item:hover { - -webkit-box-shadow: none; - box-shadow: none; - background: rgba(0, 0, 0, 0.05); - color: rgba(0, 0, 0, 0.95); -} - -/* Inverted */ - -.ui.secondary.inverted.menu .link.item:not(.disabled), -.ui.secondary.inverted.menu a.item:not(.disabled) { - color: rgba(255, 255, 255, 0.7); -} - -.ui.secondary.inverted.menu .dropdown.item:hover, -.ui.secondary.inverted.menu .link.item:hover, -.ui.secondary.inverted.menu a.item:hover { - background: rgba(255, 255, 255, 0.08); - color: #ffffff; -} - -.ui.secondary.inverted.menu .active.item { - background: rgba(255, 255, 255, 0.15); - color: #ffffff; -} - -/* Fix item margins */ - -.ui.secondary.item.menu { - margin-left: 0; - margin-right: 0; -} - -.ui.secondary.item.menu .item:last-child { - margin-right: 0; -} - -.ui.secondary.attached.menu { - -webkit-box-shadow: none; - box-shadow: none; -} - -/*--------------------- - Secondary Vertical - -----------------------*/ - -/* Sub Menu */ - -.ui.vertical.secondary.menu .item:not(.dropdown) > .menu { - margin: 0 -0.91666667em; -} - -.ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item { - margin: 0; - padding: 0.58333333em 1.36111111em; -} - -.ui.secondary.vertical.menu > .item { - border: none; - margin: 0 0 0.41666667em; - border-radius: 0.33333333rem !important; -} - -.ui.secondary.vertical.menu > .header.item { - border-radius: 0; -} - -/* Sub Menu */ - -.ui.vertical.secondary.menu .item > .menu .item { - background-color: transparent; -} - -/* Inverted */ - -.ui.secondary.inverted.menu { - background-color: transparent; -} - -/*--------------------- - Secondary Pointing - -----------------------*/ - -.ui.secondary.pointing.menu { - margin-left: 0; - margin-right: 0; - border-bottom: 2px solid rgba(34, 36, 38, 0.15); -} - -.ui.secondary.pointing.menu .item { - border-bottom-color: transparent; - border-bottom-style: solid; - border-radius: 0; - -ms-flex-item-align: end; - align-self: flex-end; - margin: 0 0 -2px; - padding: 0.83333333em 1.16666667em; - border-bottom-width: 2px; - -webkit-transition: color 0.1s ease; - transition: color 0.1s ease; -} - -.ui.secondary.pointing.menu .ui.dropdown .menu .item { - border-bottom-width: 0; -} - -.ui.secondary.pointing.menu .item > .label:not(.floating) { - margin-top: -0.3em; - margin-bottom: -0.3em; -} - -.ui.secondary.pointing.menu .item > .circular.label { - margin-top: -0.5em; - margin-bottom: -0.5em; -} - -/* Item Types */ - -.ui.secondary.pointing.menu .header.item { - color: rgba(0, 0, 0, 0.85) !important; -} - -.ui.secondary.pointing.menu .text.item { - -webkit-box-shadow: none !important; - box-shadow: none !important; -} - -.ui.secondary.pointing.menu .item:after { - display: none; -} - -/* Hover */ - -.ui.secondary.pointing.menu .dropdown.item:hover, -.ui.secondary.pointing.menu .link.item:hover, -.ui.secondary.pointing.menu a.item:hover { - background-color: transparent; - color: rgba(0, 0, 0, 0.87); -} - -/* Pressed */ - -.ui.secondary.pointing.menu .dropdown.item:active, -.ui.secondary.pointing.menu .link.item:active, -.ui.secondary.pointing.menu a.item:active { - background-color: transparent; - border-color: rgba(34, 36, 38, 0.15); -} - -/* Active */ - -.ui.secondary.pointing.menu .active.item { - background-color: transparent; - -webkit-box-shadow: none; - box-shadow: none; - border-color: currentColor; - font-weight: bold; - color: rgba(0, 0, 0, 0.95); -} - -/* Active Hover */ - -.ui.secondary.pointing.menu .active.item:hover { - border-color: currentColor; - color: rgba(0, 0, 0, 0.95); -} - -/* Active Dropdown */ - -.ui.secondary.pointing.menu .active.dropdown.item { - border-color: transparent; -} - -/* Vertical Pointing */ - -.ui.secondary.vertical.pointing.menu { - border-bottom-width: 0; - border-right-width: 2px; - border-right-style: solid; - border-right-color: rgba(34, 36, 38, 0.15); -} - -.ui.secondary.vertical.pointing.menu .item { - border-bottom: none; - border-right-style: solid; - border-right-color: transparent; - border-radius: 0 !important; - margin: 0 -2px 0 0; - border-right-width: 2px; -} - -/* Vertical Active */ - -.ui.secondary.vertical.pointing.menu .active.item { - border-color: currentColor; -} - -/* Inverted */ - -.ui.secondary.inverted.pointing.menu { - border-color: rgba(255, 255, 255, 0.1); -} - -.ui.secondary.inverted.pointing.menu .item:not(.disabled) { - color: rgba(255, 255, 255, 0.9); -} - -.ui.secondary.inverted.pointing.menu .header.item { - color: #FFFFFF !important; -} - -/* Hover */ - -.ui.secondary.inverted.pointing.menu .link.item:hover, -.ui.secondary.inverted.pointing.menu a.item:hover { - color: #ffffff; -} - -/* Active */ - -.ui.ui.secondary.inverted.pointing.menu .active.item { - border-color: #FFFFFF; - color: #ffffff; - background-color: transparent; -} - -/*-------------- - Text Menu - ---------------*/ - -.ui.text.menu { - background: none transparent; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; - border: none; - margin: 1em -0.58333333em; -} - -.ui.text.menu .item { - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; - -ms-flex-item-align: center; - align-self: center; - margin: 0 0; - padding: 0.41666667em 0.58333333em; - font-weight: normal; - color: rgba(0, 0, 0, 0.6); - -webkit-transition: opacity 0.1s ease; - transition: opacity 0.1s ease; -} - -/* Border */ - -.ui.text.menu .item:before, -.ui.text.menu .menu .item:before { - display: none !important; -} - -/* Header */ - -.ui.text.menu .header.item { - background-color: transparent; - opacity: 1; - color: rgba(0, 0, 0, 0.85); - font-size: 0.91666667em; - text-transform: uppercase; - font-weight: bold; -} - -/* Image */ - -.ui.text.menu .item > img:not(.ui) { - margin: 0; -} - -/*--- fluid text ---*/ - -.ui.text.item.menu .item { - margin: 0; -} - -/*--- vertical text ---*/ - -.ui.vertical.text.menu { - margin: 1em 0; -} - -.ui.vertical.text.menu:first-child { - margin-top: 0; -} - -.ui.vertical.text.menu:last-child { - margin-bottom: 0; -} - -.ui.vertical.text.menu .item { - margin: 0.66666667em 0; - padding-left: 0; - padding-right: 0; -} - -.ui.vertical.text.menu .item > i.icon { - float: none; - margin: 0 0.41666667em 0 0; -} - -.ui.vertical.text.menu .header.item { - margin: 0.66666667em 0 0.83333333em; -} - -/* Vertical Sub Menu */ - -.ui.vertical.text.menu .item:not(.dropdown) > .menu { - margin: 0; -} - -.ui.vertical.text.menu .item:not(.dropdown) > .menu > .item { - margin: 0; - padding: 0.58333333em 0; -} - -/*--- hover ---*/ - -.ui.text.menu .item:hover { - opacity: 1; - background-color: transparent; -} - -/*--- active ---*/ - -.ui.text.menu .active.item { - background-color: transparent; - border: none; - -webkit-box-shadow: none; - box-shadow: none; - font-weight: normal; - color: rgba(0, 0, 0, 0.95); -} - -/*--- active hover ---*/ - -.ui.text.menu .active.item:hover { - background-color: transparent; -} - -/* Disable Bariations */ - -.ui.text.pointing.menu .active.item:after { - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.text.attached.menu { - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Inverted */ - -.ui.inverted.text.menu, -.ui.inverted.text.menu .item, -.ui.inverted.text.menu .item:hover, -.ui.inverted.text.menu .active.item { - background-color: transparent; -} - -/* Fluid */ - -.ui.fluid.text.menu { - margin-left: 0; - margin-right: 0; -} - -/*-------------- - Icon Only ----------------*/ - -/* Vertical Menu */ - -.ui.vertical.icon.menu { - display: inline-block; - width: auto; -} - -/* Item */ - -.ui.icon.menu .item { - height: auto; - text-align: center; - color: #1B1C1D; -} - -/* Icon */ - -.ui.icon.menu .item > i.icon:not(.dropdown) { - margin: 0; - opacity: 1; -} - -/* Icon Gylph */ - -.ui.icon.menu i.icon:before { - opacity: 1; -} - -/* (x) Item Icon */ - -.ui.menu .icon.item > i.icon { - width: auto; - margin: 0 auto; -} - -/* Vertical Icon */ - -.ui.vertical.icon.menu .item > i.icon:not(.dropdown) { - display: block; - opacity: 1; - margin: 0 auto; - float: none; -} - -/* Inverted */ - -.ui.inverted.icon.menu .item { - color: #FFFFFF; -} - -/*-------------- - Labeled Icon - ---------------*/ - -/* Menu */ - -.ui.labeled.icon.menu { - text-align: center; -} - -/* Item */ - -.ui.labeled.icon.menu .item { - min-width: 6em; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; -} - -/* Icon */ - -.ui.labeled.icon.menu > .item > i.icon:not(.dropdown) { - height: 1em; - display: block; - font-size: 1.75em !important; - margin: 0 auto 0.5rem !important; -} - -/* Fluid */ - -.ui.fluid.labeled.icon.menu > .item { - min-width: 0; -} - -/******************************* - Variations -*******************************/ - -/*-------------- - Stackable - ---------------*/ - -@media only screen and (max-width: 767.98px) { - .ui.stackable.menu { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - } - - .ui.stackable.menu .item { - width: 100% !important; - } - - .ui.stackable.menu .item:before { - position: absolute; - content: ''; - top: auto; - bottom: 0; - left: 0; - width: 100%; - height: 1px; - background: rgba(34, 36, 38, 0.1); - } - - .ui.stackable.menu .left.menu, - .ui.stackable.menu .left.item { - margin-right: 0 !important; - } - - .ui.stackable.menu .right.menu, - .ui.stackable.menu .right.item { - margin-left: 0 !important; - } - - .ui.stackable.menu .center.menu, - .ui.stackable.menu .center.item { - margin-left: 0 !important; - margin-right: 0 !important; - } - - .ui.stackable.menu .right.menu, - .ui.stackable.menu .center.menu, - .ui.stackable.menu .left.menu { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - } -} - -/*-------------- - Colors ----------------*/ - -.ui.ui.ui.menu .primary.active.item, -.ui.ui.primary.menu .active.item:hover, -.ui.ui.primary.menu .active.item { - color: #6435C9; -} - -.ui.ui.ui.menu .red.active.item, -.ui.ui.red.menu .active.item:hover, -.ui.ui.red.menu .active.item { - color: #DB2828; -} - -.ui.ui.ui.menu .orange.active.item, -.ui.ui.orange.menu .active.item:hover, -.ui.ui.orange.menu .active.item { - color: #F2711C; -} - -.ui.ui.ui.menu .yellow.active.item, -.ui.ui.yellow.menu .active.item:hover, -.ui.ui.yellow.menu .active.item { - color: #FBBD08; -} - -.ui.ui.ui.menu .olive.active.item, -.ui.ui.olive.menu .active.item:hover, -.ui.ui.olive.menu .active.item { - color: #B5CC18; -} - -.ui.ui.ui.menu .green.active.item, -.ui.ui.green.menu .active.item:hover, -.ui.ui.green.menu .active.item { - color: #21BA45; -} - -.ui.ui.ui.menu .teal.active.item, -.ui.ui.teal.menu .active.item:hover, -.ui.ui.teal.menu .active.item { - color: #00B5AD; -} - -.ui.ui.ui.menu .blue.active.item, -.ui.ui.blue.menu .active.item:hover, -.ui.ui.blue.menu .active.item { - color: #2185D0; -} - -.ui.ui.ui.menu .violet.active.item, -.ui.ui.violet.menu .active.item:hover, -.ui.ui.violet.menu .active.item { - color: #6435C9; -} - -.ui.ui.ui.menu .purple.active.item, -.ui.ui.purple.menu .active.item:hover, -.ui.ui.purple.menu .active.item { - color: #A333C8; -} - -.ui.ui.ui.menu .pink.active.item, -.ui.ui.pink.menu .active.item:hover, -.ui.ui.pink.menu .active.item { - color: #E03997; -} - -.ui.ui.ui.menu .brown.active.item, -.ui.ui.brown.menu .active.item:hover, -.ui.ui.brown.menu .active.item { - color: #A5673F; -} - -.ui.ui.ui.menu .grey.active.item, -.ui.ui.grey.menu .active.item:hover, -.ui.ui.grey.menu .active.item { - color: #767676; -} - -.ui.ui.ui.menu .black.active.item, -.ui.ui.black.menu .active.item:hover, -.ui.ui.black.menu .active.item { - color: #1B1C1D; -} - -/*-------------- - Inverted - ---------------*/ - -.ui.inverted.menu { - border: 0 solid transparent; - background: #1B1C1D; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Menu Item */ - -.ui.inverted.menu .item, -.ui.inverted.menu .item > a:not(.ui) { - background: transparent; - color: rgba(255, 255, 255, 0.9); -} - -.ui.inverted.menu .item.menu { - background: transparent; -} - -/*--- Border ---*/ - -.ui.inverted.menu .item:before { - background: rgba(255, 255, 255, 0.08); -} - -.ui.vertical.inverted.menu .item:before { - background: rgba(255, 255, 255, 0.08); -} - -/* Sub Menu */ - -.ui.vertical.inverted.menu .menu .item, -.ui.vertical.inverted.menu .menu .item a:not(.ui) { - color: rgba(255, 255, 255, 0.5); -} - -/* Header */ - -.ui.inverted.menu .header.item { - margin: 0; - background: transparent; - -webkit-box-shadow: none; - box-shadow: none; -} - -/* Disabled */ - -.ui.ui.inverted.menu .item.disabled { - color: rgba(225, 225, 225, 0.3); -} - -/*--- Hover ---*/ - -.ui.link.inverted.menu .item:hover, -.ui.inverted.menu .dropdown.item:hover, -.ui.inverted.menu .link.item:hover, -.ui.inverted.menu a.item:hover { - background: rgba(255, 255, 255, 0.08); - color: #ffffff; -} - -.ui.vertical.inverted.menu .item .menu a.item:hover, -.ui.vertical.inverted.menu .item .menu .link.item:hover { - background: transparent; - color: #ffffff; -} - -/*--- Pressed ---*/ - -.ui.inverted.menu a.item:active, -.ui.inverted.menu .link.item:active { - background: rgba(255, 255, 255, 0.08); - color: #ffffff; -} - -/*--- Active ---*/ - -.ui.inverted.menu .active.item { - background: #3D3E3F; - color: #ffffff !important; -} - -.ui.inverted.vertical.menu .item .menu .active.item { - background: transparent; - color: #FFFFFF; -} - -.ui.inverted.pointing.menu .active.item:after { - background: #3D3E3F; - margin: 0 !important; - -webkit-box-shadow: none !important; - box-shadow: none !important; - border: none !important; -} - -/*--- Active Hover ---*/ - -.ui.inverted.menu .active.item:hover { - background: #3D3E3F; - color: #FFFFFF !important; -} - -.ui.inverted.pointing.menu .active.item:hover:after { - background: #3D3E3F; -} - -/*-------------- - Floated - ---------------*/ - -.ui.floated.menu { - float: left; - margin: 0 0.5rem 0 0; -} - -.ui.floated.menu .item:last-child:before { - display: none; -} - -.ui.right.floated.menu { - float: right; - margin: 0 0 0 0.5rem; -} - -/*-------------- - Inverted - ---------------*/ - -.ui.ui.ui.inverted.menu .primary.active.item, -.ui.ui.inverted.primary.menu { - background-color: #6435C9; -} - -.ui.inverted.primary.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.primary.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.primary.menu .active.item { - background-color: #5829bb; -} - -.ui.ui.ui.inverted.menu .red.active.item, -.ui.ui.inverted.red.menu { - background-color: #DB2828; -} - -.ui.inverted.red.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.red.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.red.menu .active.item { - background-color: #d01919; -} - -.ui.ui.ui.inverted.menu .orange.active.item, -.ui.ui.inverted.orange.menu { - background-color: #F2711C; -} - -.ui.inverted.orange.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.orange.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.orange.menu .active.item { - background-color: #f26202; -} - -.ui.ui.ui.inverted.menu .yellow.active.item, -.ui.ui.inverted.yellow.menu { - background-color: #FBBD08; -} - -.ui.inverted.yellow.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.yellow.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.yellow.menu .active.item { - background-color: #eaae00; -} - -.ui.ui.ui.inverted.menu .olive.active.item, -.ui.ui.inverted.olive.menu { - background-color: #B5CC18; -} - -.ui.inverted.olive.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.olive.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.olive.menu .active.item { - background-color: #a7bd0d; -} - -.ui.ui.ui.inverted.menu .green.active.item, -.ui.ui.inverted.green.menu { - background-color: #21BA45; -} - -.ui.inverted.green.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.green.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.green.menu .active.item { - background-color: #16ab39; -} - -.ui.ui.ui.inverted.menu .teal.active.item, -.ui.ui.inverted.teal.menu { - background-color: #00B5AD; -} - -.ui.inverted.teal.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.teal.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.teal.menu .active.item { - background-color: #009c95; -} - -.ui.ui.ui.inverted.menu .blue.active.item, -.ui.ui.inverted.blue.menu { - background-color: #2185D0; -} - -.ui.inverted.blue.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.blue.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.blue.menu .active.item { - background-color: #1678c2; -} - -.ui.ui.ui.inverted.menu .violet.active.item, -.ui.ui.inverted.violet.menu { - background-color: #6435C9; -} - -.ui.inverted.violet.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.violet.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.violet.menu .active.item { - background-color: #5829bb; -} - -.ui.ui.ui.inverted.menu .purple.active.item, -.ui.ui.inverted.purple.menu { - background-color: #A333C8; -} - -.ui.inverted.purple.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.purple.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.purple.menu .active.item { - background-color: #9627ba; -} - -.ui.ui.ui.inverted.menu .pink.active.item, -.ui.ui.inverted.pink.menu { - background-color: #E03997; -} - -.ui.inverted.pink.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.pink.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.pink.menu .active.item { - background-color: #e61a8d; -} - -.ui.ui.ui.inverted.menu .brown.active.item, -.ui.ui.inverted.brown.menu { - background-color: #A5673F; -} - -.ui.inverted.brown.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.brown.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.brown.menu .active.item { - background-color: #975b33; -} - -.ui.ui.ui.inverted.menu .grey.active.item, -.ui.ui.inverted.grey.menu { - background-color: #767676; -} - -.ui.inverted.grey.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.grey.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.grey.menu .active.item { - background-color: #838383; -} - -.ui.ui.ui.inverted.menu .black.active.item, -.ui.ui.inverted.black.menu { - background-color: #1B1C1D; -} - -.ui.inverted.black.menu .item:before { - background-color: rgba(34, 36, 38, 0.1); -} - -.ui.ui.inverted.black.menu .active.item { - background-color: rgba(0, 0, 0, 0.1); -} - -.ui.inverted.pointing.black.menu .active.item { - background-color: #27292a; -} - -.ui.ui.ui.inverted.pointing.menu .active.item:after { - background-color: inherit; -} - -/*-------------- - Fitted - ---------------*/ - -.ui.fitted.menu .item, -.ui.fitted.menu .item .menu .item, -.ui.menu .fitted.item { - padding: 0; -} - -.ui.horizontally.fitted.menu .item, -.ui.horizontally.fitted.menu .item .menu .item, -.ui.menu .horizontally.fitted.item { - padding-top: 0.91666667em; - padding-bottom: 0.91666667em; -} - -.ui.vertically.fitted.menu .item, -.ui.vertically.fitted.menu .item .menu .item, -.ui.menu .vertically.fitted.item { - padding-left: 1.16666667em; - padding-right: 1.16666667em; -} - -/*-------------- - Borderless - ---------------*/ - -.ui.borderless.menu .item:before, -.ui.borderless.menu .item .menu .item:before, -.ui.menu .borderless.item:before { - background: none !important; -} - -/*------------------- - Compact - --------------------*/ - -.ui.compact.menu { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - margin: 0; - vertical-align: middle; -} - -.ui.compact.vertical.menu { - /* IE hack to make dropdown icons appear inline */ - display: -ms-inline-flexbox !important; - display: inline-block; -} - -.ui.compact.menu:not(.secondary) .item:last-child { - border-radius: 0 0.33333333rem 0.33333333rem 0; -} - -.ui.compact.menu .item:last-child:before { - display: none; -} - -.ui.compact.vertical.menu { - width: auto !important; -} - -.ui.compact.vertical.menu .item:last-child::before { - display: block; -} - -/*------------------- - Fluid - --------------------*/ - -.ui.menu.fluid, -.ui.vertical.menu.fluid { - width: 100% !important; -} - -/*------------------- - Evenly Sized ---------------------*/ - -.ui.item.menu, -.ui.item.menu .item { - width: 100%; - padding-left: 0 !important; - padding-right: 0 !important; - margin-left: 0 !important; - margin-right: 0 !important; - text-align: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; -} - -.ui.attached.item.menu:not(.tabular) { - margin: 0 -1px !important; -} - -.ui.item.menu .item:last-child:before { - display: none; -} - -.ui.menu.two.item .item { - width: 50%; -} - -.ui.menu.three.item .item { - width: 33.333%; -} - -.ui.menu.four.item .item { - width: 25%; -} - -.ui.menu.five.item .item { - width: 20%; -} - -.ui.menu.six.item .item { - width: 16.666%; -} - -.ui.menu.seven.item .item { - width: 14.285%; -} - -.ui.menu.eight.item .item { - width: 12.5%; -} - -.ui.menu.nine.item .item { - width: 11.11%; -} - -.ui.menu.ten.item .item { - width: 10%; -} - -.ui.menu.eleven.item .item { - width: 9.09%; -} - -.ui.menu.twelve.item .item { - width: 8.333%; -} - -/*-------------- - Fixed - ---------------*/ - -.ui.menu.fixed { - position: fixed; - z-index: 101; - margin: 0; - width: 100%; -} - -.ui.menu.fixed, -.ui.menu.fixed .item:first-child, -.ui.menu.fixed .item:last-child { - border-radius: 0 !important; -} - -.ui.fixed.menu, -.ui[class*="top fixed"].menu { - top: 0; - left: 0; - right: auto; - bottom: auto; -} - -.ui[class*="top fixed"].menu { - border-top: none; - border-left: none; - border-right: none; -} - -.ui[class*="right fixed"].menu { - border-top: none; - border-bottom: none; - border-right: none; - top: 0; - right: 0; - left: auto; - bottom: auto; - width: auto; - height: 100%; -} - -.ui[class*="bottom fixed"].menu { - border-bottom: none; - border-left: none; - border-right: none; - bottom: 0; - left: 0; - top: auto; - right: auto; -} - -.ui[class*="left fixed"].menu { - border-top: none; - border-bottom: none; - border-left: none; - top: 0; - left: 0; - right: auto; - bottom: auto; - width: auto; - height: 100%; -} - -/* Coupling with Grid */ - -.ui.fixed.menu + .ui.grid { - padding-top: 2.75rem; -} - -/*------------------- - Pointing - --------------------*/ - -.ui.pointing.menu .item:after { - visibility: hidden; - position: absolute; - content: ''; - top: 100%; - left: 50%; - -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); - transform: translateX(-50%) translateY(-50%) rotate(45deg); - background: none; - margin: 0.5px 0 0; - width: 0.66666667em; - height: 0.66666667em; - border: none; - border-bottom: 1px solid #D4D4D5; - border-right: 1px solid #D4D4D5; - z-index: 2; - -webkit-transition: background 0.1s ease; - transition: background 0.1s ease; -} - -.ui.vertical.pointing.menu .item:after { - position: absolute; - top: 50%; - right: 0; - bottom: auto; - left: auto; - -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg); - transform: translateX(50%) translateY(-50%) rotate(45deg); - margin: 0 -0.5px 0 0; - border: none; - border-top: 1px solid #D4D4D5; - border-right: 1px solid #D4D4D5; -} - -@media only screen and (max-width: 767.98px) { - .stackable .ui.vertical.pointing.menu .item::after { - display: none; - } -} - -.ui.pointing.menu .ui.dropdown .menu .item:after, -.ui.vertical.pointing.menu .ui.dropdown .menu .item:after { - display: none; -} - -/* Active */ - -.ui.pointing.menu .active.item:after { - visibility: visible; -} - -.ui.pointing.menu .active.dropdown.item:after { - visibility: hidden; -} - -/* Don't double up pointers */ - -.ui.pointing.menu .dropdown.active.item:after, -.ui.pointing.menu .active.item .menu .active.item:after { - display: none; -} - -/* Colors */ - -.ui.pointing.menu .active.item:hover:after { - background-color: #F2F2F2; -} - -.ui.pointing.menu .active.item:after { - background-color: #F2F2F2; -} - -.ui.pointing.menu .active.item:hover:after { - background-color: #F2F2F2; -} - -.ui.vertical.pointing.menu .active.item:hover:after { - background-color: #F2F2F2; -} - -.ui.vertical.pointing.menu .active.item:after { - background-color: #F2F2F2; -} - -.ui.vertical.pointing.menu .menu .active.item:after { - background-color: #FFFFFF; -} - -.ui.inverted.pointing.menu .primary.active.item:after { - background-color: #6435C9; -} - -.ui.inverted.pointing.menu .secondary.active.item:after { - background-color: #1B1C1D; -} - -.ui.inverted.pointing.menu .red.active.item:after { - background-color: #DB2828; -} - -.ui.inverted.pointing.menu .orange.active.item:after { - background-color: #F2711C; -} - -.ui.inverted.pointing.menu .yellow.active.item:after { - background-color: #FBBD08; -} - -.ui.inverted.pointing.menu .olive.active.item:after { - background-color: #B5CC18; -} - -.ui.inverted.pointing.menu .green.active.item:after { - background-color: #21BA45; -} - -.ui.inverted.pointing.menu .teal.active.item:after { - background-color: #00B5AD; -} - -.ui.inverted.pointing.menu .blue.active.item:after { - background-color: #2185D0; -} - -.ui.inverted.pointing.menu .violet.active.item:after { - background-color: #6435C9; -} - -.ui.inverted.pointing.menu .purple.active.item:after { - background-color: #A333C8; -} - -.ui.inverted.pointing.menu .pink.active.item:after { - background-color: #E03997; -} - -.ui.inverted.pointing.menu .brown.active.item:after { - background-color: #A5673F; -} - -.ui.inverted.pointing.menu .grey.active.item:after { - background-color: #767676; -} - -.ui.inverted.pointing.menu .black.active.item:after { - background-color: #1B1C1D; -} - -/*-------------- - Attached - ---------------*/ - -/* Middle */ - -.ui.attached.menu { - top: 0; - bottom: 0; - border-radius: 0; - margin: 0 -1px; - width: calc(100% + 2px); - max-width: calc(100% + 2px); - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.attached + .ui.attached.menu:not(.top) { - border-top: none; -} - -/* Top */ - -.ui[class*="top attached"].menu { - bottom: 0; - margin-bottom: 0; - top: 0; - margin-top: 1rem; - border-radius: 0.33333333rem 0.33333333rem 0 0; -} - -.ui.menu[class*="top attached"]:first-child { - margin-top: 0; -} - -/* Bottom */ - -.ui[class*="bottom attached"].menu { - bottom: 0; - margin-top: 0; - top: 0; - margin-bottom: 1rem; - -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; - box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; - border-radius: 0 0 0.33333333rem 0.33333333rem; -} - -.ui[class*="bottom attached"].menu:last-child { - margin-bottom: 0; -} - -/* Attached Menu Item */ - -.ui.top.attached.menu > .item:first-child { - border-radius: 0.33333333rem 0 0 0; -} - -.ui.bottom.attached.menu > .item:first-child { - border-radius: 0 0 0 0.33333333rem; -} - -/* Tabular Attached */ - -.ui.attached.menu:not(.tabular) { - border: 1px solid #D4D4D5; -} - -.ui.attached.inverted.menu { - border: none; -} - -.ui.attached.tabular.menu { - margin-left: 0; - margin-right: 0; - width: 100%; -} - -/*-------------- - Sizes ----------------*/ - -.ui.menu { - font-size: 1rem; -} - -.ui.vertical.menu { - width: 15rem; -} - -.ui.mini.menu, -.ui.mini.menu .dropdown, -.ui.mini.menu .dropdown .menu > .item { - font-size: 0.91666667rem; -} - -.ui.mini.vertical.menu:not(.icon) { - width: 9rem; -} - -.ui.tiny.menu, -.ui.tiny.menu .dropdown, -.ui.tiny.menu .dropdown .menu > .item { - font-size: 1rem; -} - -.ui.tiny.vertical.menu:not(.icon) { - width: 11rem; -} - -.ui.small.menu, -.ui.small.menu .dropdown, -.ui.small.menu .dropdown .menu > .item { - font-size: 1.08333333rem; -} - -.ui.small.vertical.menu:not(.icon) { - width: 13rem; -} - -.ui.large.menu, -.ui.large.menu .dropdown, -.ui.large.menu .dropdown .menu > .item { - font-size: 1.25rem; -} - -.ui.large.vertical.menu:not(.icon) { - width: 18rem; -} - -.ui.big.menu, -.ui.big.menu .dropdown, -.ui.big.menu .dropdown .menu > .item { - font-size: 1.33333333rem; -} - -.ui.big.vertical.menu:not(.icon) { - width: 20rem; -} - -.ui.huge.menu, -.ui.huge.menu .dropdown, -.ui.huge.menu .dropdown .menu > .item { - font-size: 1.41666667rem; -} - -.ui.huge.vertical.menu:not(.icon) { - width: 22rem; -} - -.ui.massive.menu, -.ui.massive.menu .dropdown, -.ui.massive.menu .dropdown .menu > .item { - font-size: 1.5rem; -} - -.ui.massive.vertical.menu:not(.icon) { - width: 25rem; -} - -/*------------------- - Inverted dropdowns ---------------------*/ - -.ui.menu .ui.inverted.inverted.dropdown.item .menu { - background: #1B1C1D; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.menu .ui.inverted.dropdown .menu > .item { - color: rgba(255, 255, 255, 0.8) !important; -} - -.ui.menu .ui.inverted.dropdown .menu > .active.item { - background: transparent !important; - color: rgba(255, 255, 255, 0.8) !important; -} - -.ui.menu .ui.inverted.dropdown .menu > .item:hover { - background: rgba(255, 255, 255, 0.08) !important; - color: rgba(255, 255, 255, 0.8) !important; -} - -.ui.menu .ui.inverted.dropdown .menu > .selected.item { - background: rgba(255, 255, 255, 0.15) !important; - color: rgba(255, 255, 255, 0.8) !important; -} - -/* Vertical */ - -.ui.vertical.menu .inverted.dropdown.item .menu { - -webkit-box-shadow: none; - box-shadow: none; -} - -/******************************* - Theme Overrides -*******************************/ - -/******************************* - Site Overrides -*******************************/ -/*! - * # Fomantic-UI 2.8.8 - Calendar - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Popup -*******************************/ - -.ui.calendar .ui.popup { - max-width: none; - padding: 0; - border: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -/******************************* - Calendar -*******************************/ - -.ui.calendar .calendar:focus { - outline: 0; -} - -/******************************* - Grid -*******************************/ - -.ui.calendar .ui.popup .ui.grid { - display: block; - white-space: nowrap; -} - -.ui.calendar .ui.popup .ui.grid > .column { - width: auto; -} - -/******************************* - Table -*******************************/ - -.ui.calendar .ui.table.year, -.ui.calendar .ui.table.month, -.ui.calendar .ui.table.minute { - min-width: 15em; -} - -.ui.calendar .ui.table.day { - min-width: 18em; -} - -.ui.calendar .ui.table.day.andweek { - min-width: 22em; -} - -.ui.calendar .ui.table.hour { - min-width: 20em; -} - -.ui.calendar .ui.table tr th, -.ui.calendar .ui.table tr td { - padding: 0.5em; - white-space: nowrap; - text-align: center; -} - -.ui.calendar .ui.table tr th { - border-left: none; -} - -.ui.calendar .ui.table tr th i.icon { - margin: 0; -} - -.ui.calendar .ui.table tr:first-child th { - position: relative; - padding-left: 0; - padding-right: 0; -} - -.ui.calendar .ui.table.day tr:first-child th { - border: none; -} - -.ui.calendar .ui.table.day tr:nth-child(2) th { - padding-top: 0.2em; - padding-bottom: 0.3em; -} - -.ui.calendar .ui.table tr td { - padding-left: 0.1em; - padding-right: 0.1em; -} - -.ui.calendar .ui.table tr .link { - cursor: pointer; -} - -.ui.calendar .ui.table tr .prev.link { - width: 14.28571429%; - position: absolute; - left: 0; -} - -.ui.calendar .ui.table tr .next.link { - width: 14.28571429%; - position: absolute; - right: 0; -} - -.ui.ui.calendar .ui.table tr .disabled { - pointer-events: auto; - cursor: default; - color: rgba(40, 40, 40, 0.3); -} - -.ui.calendar .ui.table tr .adjacent:not(.disabled):not(.active) { - color: rgba(0, 0, 0, 0.6); - background: rgba(0, 0, 0, 0.03); -} - -/*-------------- - States ----------------*/ - -.ui.calendar .ui.table tr td.today { - font-weight: bold; -} - -.ui.calendar .ui.table tr td.range { - background: rgba(0, 0, 0, 0.05); - color: rgba(0, 0, 0, 0.95); - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.calendar:not(.disabled) .calendar:focus .ui.table tbody tr td.focus, -.ui.calendar:not(.disabled) .calendar.active .ui.table tbody tr td.focus { - -webkit-box-shadow: inset 0 0 0 1px #6435C9; - box-shadow: inset 0 0 0 1px #6435C9; -} - -.ui.inverted.calendar .ui.table.inverted tr td.range { - background: rgba(255, 255, 255, 0.08); - color: #ffffff; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.inverted.calendar:not(.disabled) .calendar:focus .ui.table.inverted tbody tr td.focus, -.ui.inverted.calendar:not(.disabled) .calendar.active .ui.table.inverted tbody tr td.focus { - -webkit-box-shadow: inset 0 0 0 1px #6435C9; - box-shadow: inset 0 0 0 1px #6435C9; -} - -.ui.inverted.calendar .ui.inverted.table tr .disabled { - color: rgba(225, 225, 225, 0.3); -} - -.ui.inverted.calendar .ui.inverted.table tr .adjacent:not(.disabled):not(.active) { - color: rgba(255, 255, 255, 0.8); - background: rgba(255, 255, 255, 0.02); -} - -/******************************* - States -*******************************/ - -/*-------------------- - Disabled - ---------------------*/ - -.ui.disabled.calendar { - opacity: 0.45; -} - -.ui.disabled.calendar > .input, -.ui.disabled.calendar .ui.table tr .link { - pointer-events: none; -} - -/******************************* - Theme Overrides -*******************************/ -/*! - * # Fomantic-UI 2.8.8 - Popup - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Popup -*******************************/ - -.ui.popup { - display: none; - position: absolute; - top: 0; - right: 0; - /* Fixes content being squished when inline (moz only) */ - min-width: -webkit-min-content; - min-width: -moz-min-content; - min-width: min-content; - z-index: 1900; - border: 1px solid #D4D4D5; - line-height: 1.4285em; - max-width: 250px; - background: #FFFFFF; - padding: 0.833em 1em; - font-weight: normal; - font-style: normal; - color: rgba(0, 0, 0, 0.87); - border-radius: 0.33333333rem; - -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.popup > .header { - padding: 0; - font-family: 'Raleway', sans-serif; - font-size: 1.16666667em; - line-height: 1.2; - font-weight: bold; -} - -.ui.popup > .header + .content { - padding-top: 0.58333333em; -} - -.ui.popup:before { - position: absolute; - content: ''; - width: 0.83333333em; - height: 0.83333333em; - background: #FFFFFF; - -webkit-transform: rotate(45deg); - transform: rotate(45deg); - z-index: 1901; - -webkit-box-shadow: 1px 1px 0 0 #bababc; - box-shadow: 1px 1px 0 0 #bababc; -} - -/******************************* - Types -*******************************/ - -/*-------------- - Tooltip - ---------------*/ - -/* Content */ - -[data-tooltip] { - position: relative; -} - -/* Arrow */ - -[data-tooltip]:before { - pointer-events: none; - position: absolute; - content: ''; - font-size: 1rem; - width: 0.83333333em; - height: 0.83333333em; - background: #FFFFFF; - -webkit-transform: rotate(45deg); - transform: rotate(45deg); - z-index: 1901; - -webkit-box-shadow: 1px 1px 0 0 #bababc; - box-shadow: 1px 1px 0 0 #bababc; -} - -/* Popup */ - -[data-tooltip]:after { - pointer-events: none; - content: attr(data-tooltip); - position: absolute; - text-transform: none; - text-align: left; - text-shadow: none; - white-space: nowrap; - font-size: 1rem; - border: 1px solid #D4D4D5; - line-height: 1.4285em; - max-width: none; - background: #FFFFFF; - padding: 0.833em 1em; - font-weight: normal; - font-style: normal; - color: rgba(0, 0, 0, 0.87); - border-radius: 0.33333333rem; - -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - z-index: 1900; -} - -/* Default Position (Top Center) */ - -[data-tooltip]:not([data-position]):before { - top: auto; - right: auto; - bottom: 100%; - left: 50%; - background: #FFFFFF; - margin-left: -0.08333333rem; - margin-bottom: 0.16666667rem; -} - -[data-tooltip]:not([data-position]):after { - left: 50%; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - bottom: 100%; - margin-bottom: 0.58333333em; -} - -/* Animation */ - -[data-tooltip]:before, -[data-tooltip]:after { - pointer-events: none; - visibility: hidden; - opacity: 0; - -webkit-transition: opacity 0.1s ease, -webkit-transform 0.1s ease; - transition: opacity 0.1s ease, -webkit-transform 0.1s ease; - transition: transform 0.1s ease, opacity 0.1s ease; - transition: transform 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease; -} - -[data-tooltip]:before { - -webkit-transform: rotate(45deg) scale(0) !important; - transform: rotate(45deg) scale(0) !important; - -webkit-transform-origin: center top; - transform-origin: center top; -} - -[data-tooltip]:after { - -webkit-transform-origin: center bottom; - transform-origin: center bottom; -} - -[data-tooltip]:hover:before, -[data-tooltip]:hover:after { - visibility: visible; - pointer-events: auto; - opacity: 1; -} - -[data-tooltip]:hover:before { - -webkit-transform: rotate(45deg) scale(1) !important; - transform: rotate(45deg) scale(1) !important; -} - -/* Animation Position */ - -[data-tooltip]:after, -[data-tooltip][data-position="top center"]:after, -[data-tooltip][data-position="bottom center"]:after { - -webkit-transform: translateX(-50%) scale(0) !important; - transform: translateX(-50%) scale(0) !important; -} - -[data-tooltip]:hover:after, -[data-tooltip][data-position="bottom center"]:hover:after { - -webkit-transform: translateX(-50%) scale(1) !important; - transform: translateX(-50%) scale(1) !important; -} - -[data-tooltip][data-position="left center"]:after, -[data-tooltip][data-position="right center"]:after { - -webkit-transform: translateY(-50%) scale(0) !important; - transform: translateY(-50%) scale(0) !important; -} - -[data-tooltip][data-position="left center"]:hover:after, -[data-tooltip][data-position="right center"]:hover:after { - -webkit-transform: translateY(-50%) scale(1) !important; - transform: translateY(-50%) scale(1) !important; - -moz-transform: translateY(-50%) scale(1.0001) !important; -} - -[data-tooltip][data-position="top left"]:after, -[data-tooltip][data-position="top right"]:after, -[data-tooltip][data-position="bottom left"]:after, -[data-tooltip][data-position="bottom right"]:after { - -webkit-transform: scale(0) !important; - transform: scale(0) !important; -} - -[data-tooltip][data-position="top left"]:hover:after, -[data-tooltip][data-position="top right"]:hover:after, -[data-tooltip][data-position="bottom left"]:hover:after, -[data-tooltip][data-position="bottom right"]:hover:after { - -webkit-transform: scale(1) !important; - transform: scale(1) !important; -} - -[data-tooltip][data-variation~="fixed"]:after { - white-space: normal; - width: 250px; -} - -[data-tooltip][data-variation*="wide fixed"]:after { - width: 350px; -} - -[data-tooltip][data-variation*="very wide fixed"]:after { - width: 550px; -} - -@media only screen and (max-width: 767.98px) { - [data-tooltip][data-variation~="fixed"]:after { - width: 250px; - } -} - -/*-------------- - Inverted - ---------------*/ - -/* Arrow */ - -[data-tooltip][data-inverted]:before { - -webkit-box-shadow: none !important; - box-shadow: none !important; -} - -/* Arrow Position */ - -[data-tooltip][data-inverted]:before { - background: #1B1C1D; -} - -/* Popup */ - -[data-tooltip][data-inverted]:after { - background: #1B1C1D; - color: #FFFFFF; - border: none; - -webkit-box-shadow: none; - box-shadow: none; -} - -[data-tooltip][data-inverted]:after .header { - background: none; - color: #FFFFFF; -} - -/*-------------- - Position - ---------------*/ - -[data-position~="top"][data-tooltip]:before { - background: #FFFFFF; -} - -/* Top Center */ - -[data-position="top center"][data-tooltip]:after { - top: auto; - right: auto; - left: 50%; - bottom: 100%; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - margin-bottom: 0.58333333em; -} - -[data-position="top center"][data-tooltip]:before { - top: auto; - right: auto; - bottom: 100%; - left: 50%; - background: #FFFFFF; - margin-left: -0.08333333rem; - margin-bottom: 0.16666667rem; -} - -/* Top Left */ - -[data-position="top left"][data-tooltip]:after { - top: auto; - right: auto; - left: 0; - bottom: 100%; - margin-bottom: 0.58333333em; -} - -[data-position="top left"][data-tooltip]:before { - top: auto; - right: auto; - bottom: 100%; - left: 1em; - margin-left: -0.08333333rem; - margin-bottom: 0.16666667rem; -} - -/* Top Right */ - -[data-position="top right"][data-tooltip]:after { - top: auto; - left: auto; - right: 0; - bottom: 100%; - margin-bottom: 0.58333333em; -} - -[data-position="top right"][data-tooltip]:before { - top: auto; - left: auto; - bottom: 100%; - right: 1em; - margin-left: -0.08333333rem; - margin-bottom: 0.16666667rem; -} - -[data-position~="bottom"][data-tooltip]:before { - background: #FFFFFF; - -webkit-box-shadow: -1px -1px 0 0 #bababc; - box-shadow: -1px -1px 0 0 #bababc; -} - -/* Bottom Center */ - -[data-position="bottom center"][data-tooltip]:after { - bottom: auto; - right: auto; - left: 50%; - top: 100%; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - margin-top: 0.58333333em; -} - -[data-position="bottom center"][data-tooltip]:before { - bottom: auto; - right: auto; - top: 100%; - left: 50%; - margin-left: -0.08333333rem; - margin-top: 0.36666667em; - -webkit-transform-origin: center top; - transform-origin: center top; -} - -/* Bottom Left */ - -[data-position="bottom left"][data-tooltip]:after { - left: 0; - top: 100%; - margin-top: 0.58333333em; -} - -[data-position="bottom left"][data-tooltip]:before { - bottom: auto; - right: auto; - top: 100%; - left: 1em; - margin-left: -0.08333333rem; - margin-top: 0.16666667rem; -} - -/* Bottom Right */ - -[data-position="bottom right"][data-tooltip]:after { - right: 0; - top: 100%; - margin-top: 0.58333333em; -} - -[data-position="bottom right"][data-tooltip]:before { - bottom: auto; - left: auto; - top: 100%; - right: 1em; - margin-left: -0.16666667rem; - margin-top: 0.08333333rem; -} - -/* Left Center */ - -[data-position="left center"][data-tooltip]:after { - right: 100%; - top: 50%; - margin-right: 0.58333333em; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); -} - -[data-position="left center"][data-tooltip]:before { - right: 100%; - top: 50%; - margin-top: -0.16666667rem; - margin-right: -0.08333333rem; - background: #FFFFFF; - -webkit-box-shadow: 1px -1px 0 0 #bababc; - box-shadow: 1px -1px 0 0 #bababc; -} - -/* Right Center */ - -[data-position="right center"][data-tooltip]:after { - left: 100%; - top: 50%; - margin-left: 0.58333333em; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); -} - -[data-position="right center"][data-tooltip]:before { - left: 100%; - top: 50%; - margin-top: -0.08333333rem; - margin-left: 0.16666667rem; - background: #FFFFFF; - -webkit-box-shadow: -1px 1px 0 0 #bababc; - box-shadow: -1px 1px 0 0 #bababc; -} - -/* Inverted Arrow Color */ - -[data-inverted][data-position~="bottom"][data-tooltip]:before { - background: #1B1C1D; - -webkit-box-shadow: -1px -1px 0 0 #bababc; - box-shadow: -1px -1px 0 0 #bababc; -} - -[data-inverted][data-position="left center"][data-tooltip]:before { - background: #1B1C1D; - -webkit-box-shadow: 1px -1px 0 0 #bababc; - box-shadow: 1px -1px 0 0 #bababc; -} - -[data-inverted][data-position="right center"][data-tooltip]:before { - background: #1B1C1D; - -webkit-box-shadow: -1px 1px 0 0 #bababc; - box-shadow: -1px 1px 0 0 #bababc; -} - -[data-inverted][data-position~="top"][data-tooltip]:before { - background: #1B1C1D; -} - -[data-position~="bottom"][data-tooltip]:before { - -webkit-transform-origin: center bottom; - transform-origin: center bottom; -} - -[data-position~="bottom"][data-tooltip]:after { - -webkit-transform-origin: center top; - transform-origin: center top; -} - -[data-position="left center"][data-tooltip]:before { - -webkit-transform-origin: top center; - transform-origin: top center; -} - -[data-position="left center"][data-tooltip]:after { - -webkit-transform-origin: right center; - transform-origin: right center; -} - -[data-position="right center"][data-tooltip]:before { - -webkit-transform-origin: right center; - transform-origin: right center; -} - -[data-position="right center"][data-tooltip]:after { - -webkit-transform-origin: left center; - transform-origin: left center; -} - -/*-------------- - Basic - ---------------*/ - -[data-tooltip][data-variation~="basic"]:before { - display: none; -} - -/*-------------- - Spacing ----------------*/ - -.ui.popup { - margin: 0; -} - -/* Extending from Top */ - -.ui.top.popup { - margin: 0 0 0.83333333em; -} - -.ui.top.left.popup { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; -} - -.ui.top.center.popup { - -webkit-transform-origin: center bottom; - transform-origin: center bottom; -} - -.ui.top.right.popup { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; -} - -/* Extending from Vertical Center */ - -.ui.left.center.popup { - margin: 0 0.83333333em 0 0; - -webkit-transform-origin: right 50%; - transform-origin: right 50%; -} - -.ui.right.center.popup { - margin: 0 0 0 0.83333333em; - -webkit-transform-origin: left 50%; - transform-origin: left 50%; -} - -/* Extending from Bottom */ - -.ui.bottom.popup { - margin: 0.83333333em 0 0; -} - -.ui.bottom.left.popup { - -webkit-transform-origin: left top; - transform-origin: left top; -} - -.ui.bottom.center.popup { - -webkit-transform-origin: center top; - transform-origin: center top; -} - -.ui.bottom.right.popup { - -webkit-transform-origin: right top; - transform-origin: right top; -} - -/*-------------- - Pointer - ---------------*/ - -/*--- Below ---*/ - -.ui.bottom.center.popup:before { - margin-left: -0.36666667em; - top: -0.36666667em; - left: 50%; - right: auto; - bottom: auto; - -webkit-box-shadow: -1px -1px 0 0 #bababc; - box-shadow: -1px -1px 0 0 #bababc; -} - -.ui.bottom.left.popup { - margin-left: 0; -} - -/*rtl:rename*/ - -.ui.bottom.left.popup:before { - top: -0.36666667em; - left: 1em; - right: auto; - bottom: auto; - margin-left: 0; - -webkit-box-shadow: -1px -1px 0 0 #bababc; - box-shadow: -1px -1px 0 0 #bababc; -} - -.ui.bottom.right.popup { - margin-right: 0; -} - -/*rtl:rename*/ - -.ui.bottom.right.popup:before { - top: -0.36666667em; - right: 1em; - bottom: auto; - left: auto; - margin-left: 0; - -webkit-box-shadow: -1px -1px 0 0 #bababc; - box-shadow: -1px -1px 0 0 #bababc; -} - -/*--- Above ---*/ - -.ui.top.center.popup:before { - top: auto; - right: auto; - bottom: -0.36666667em; - left: 50%; - margin-left: -0.36666667em; -} - -.ui.top.left.popup { - margin-left: 0; -} - -/*rtl:rename*/ - -.ui.top.left.popup:before { - bottom: -0.36666667em; - left: 1em; - top: auto; - right: auto; - margin-left: 0; -} - -.ui.top.right.popup { - margin-right: 0; -} - -/*rtl:rename*/ - -.ui.top.right.popup:before { - bottom: -0.36666667em; - right: 1em; - top: auto; - left: auto; - margin-left: 0; -} - -/*--- Left Center ---*/ - -/*rtl:rename*/ - -.ui.left.center.popup:before { - top: 50%; - right: -0.36666667em; - bottom: auto; - left: auto; - margin-top: -0.36666667em; - -webkit-box-shadow: 1px -1px 0 0 #bababc; - box-shadow: 1px -1px 0 0 #bababc; -} - -/*--- Right Center ---*/ - -/*rtl:rename*/ - -.ui.right.center.popup:before { - top: 50%; - left: -0.36666667em; - bottom: auto; - right: auto; - margin-top: -0.36666667em; - -webkit-box-shadow: -1px 1px 0 0 #bababc; - box-shadow: -1px 1px 0 0 #bababc; -} - -.ui.right.center.popup:before, -.ui.left.center.popup:before { - background: #FFFFFF; -} - -/* Arrow Color By Location */ - -.ui.bottom.popup:before { - background: #FFFFFF; -} - -.ui.top.popup:before { - background: #FFFFFF; -} - -/* Inverted Arrow Color */ - -.ui.inverted.bottom.popup:before { - background: #1B1C1D; -} - -.ui.inverted.right.center.popup:before, -.ui.inverted.left.center.popup:before { - background: #1B1C1D; -} - -.ui.inverted.top.popup:before { - background: #1B1C1D; -} - -/******************************* - Coupling -*******************************/ - -/* Immediate Nested Grid */ - -.ui.popup > .ui.grid:not(.padded) { - width: calc(100% + 1.75rem); - margin: -0.7rem -0.875rem; -} - -/******************************* - States -*******************************/ - -.ui.loading.popup { - display: block; - visibility: hidden; - z-index: -1; -} - -.ui.animating.popup, -.ui.visible.popup { - display: block; -} - -.ui.visible.popup { - -webkit-transform: translateZ(0); - transform: translateZ(0); - -webkit-backface-visibility: hidden; - backface-visibility: hidden; -} - -/******************************* - Variations -*******************************/ - -/*-------------- - Basic - ---------------*/ - -.ui.basic.popup:before { - display: none; -} - -.ui.fixed.popup { - width: 250px; -} - -/*-------------- - Wide - ---------------*/ - -.ui.wide.popup { - max-width: 350px; -} - -.ui.wide.popup.fixed { - width: 350px; -} - -.ui[class*="very wide"].popup { - max-width: 550px; -} - -.ui[class*="very wide"].popup.fixed { - width: 550px; -} - -@media only screen and (max-width: 767.98px) { - .ui.wide.popup, - .ui[class*="very wide"].popup { - max-width: 250px; - } - - .ui.wide.popup.fixed, - .ui[class*="very wide"].popup.fixed { - width: 250px; - } -} - -/*-------------- - Fluid - ---------------*/ - -.ui.fluid.popup { - width: 100%; - max-width: none; -} - -/*-------------- - Colors - ---------------*/ - -/* Inverted colors */ - -.ui.inverted.popup { - background: #1B1C1D; - color: #FFFFFF; - border: none; - -webkit-box-shadow: none; - box-shadow: none; -} - -.ui.inverted.popup .header { - background-color: none; - color: #FFFFFF; -} - -.ui.inverted.popup:before { - background-color: #1B1C1D; - -webkit-box-shadow: none !important; - box-shadow: none !important; -} - -/*-------------- - Flowing - ---------------*/ - -.ui.flowing.popup { - max-width: none; -} - -/*-------------- - Sizes ----------------*/ - -.ui.popup { - font-size: 1rem; -} - -.ui.mini.popup { - font-size: 0.75rem; -} - -[data-tooltip][data-variation~="mini"]:before, -[data-tooltip][data-variation~="mini"]:after { - font-size: 0.75rem; -} - -.ui.tiny.popup { - font-size: 0.83333333rem; -} - -[data-tooltip][data-variation~="tiny"]:before, -[data-tooltip][data-variation~="tiny"]:after { - font-size: 0.83333333rem; -} - -.ui.small.popup { - font-size: 0.91666667rem; -} - -[data-tooltip][data-variation~="small"]:before, -[data-tooltip][data-variation~="small"]:after { - font-size: 0.91666667rem; -} - -.ui.large.popup { - font-size: 1.16666667rem; -} - -[data-tooltip][data-variation~="large"]:before, -[data-tooltip][data-variation~="large"]:after { - font-size: 1.16666667rem; -} - -.ui.big.popup { - font-size: 1.25rem; -} - -[data-tooltip][data-variation~="big"]:before, -[data-tooltip][data-variation~="big"]:after { - font-size: 1.25rem; -} - -.ui.huge.popup { - font-size: 1.41666667rem; -} - -[data-tooltip][data-variation~="huge"]:before, -[data-tooltip][data-variation~="huge"]:after { - font-size: 1.41666667rem; -} - -.ui.massive.popup { - font-size: 1.75rem; -} - -[data-tooltip][data-variation~="massive"]:before, -[data-tooltip][data-variation~="massive"]:after { - font-size: 1.75rem; -} - -/******************************* - Theme Overrides -*******************************/ - -/******************************* - User Overrides -*******************************/ -/*! - * # Fomantic-UI 2.8.8 - Message - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Message -*******************************/ - -.ui.message { - position: relative; - min-height: 1em; - margin: 1em 0; - background: #F8F8F9; - padding: 1em 1.5em; - line-height: 1.4285em; - color: rgba(0, 0, 0, 0.87); - -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; - transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; - transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease; - transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease; - border-radius: 0.33333333rem; - -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.message:first-child { - margin-top: 0; -} - -.ui.message:last-child { - margin-bottom: 0; -} - -/*-------------- - Content ----------------*/ - -/* Header */ - -.ui.message .header { - display: block; - font-family: 'Raleway', sans-serif; - font-weight: bold; - margin: -0.14285714em 0 0 0; -} - -/* Default font size */ - -.ui.message .header:not(.ui) { - font-size: 1.16666667em; -} - -/* Paragraph */ - -.ui.message p { - opacity: 0.85; - margin: 0.75em 0; -} - -.ui.message p:first-child { - margin-top: 0; -} - -.ui.message p:last-child { - margin-bottom: 0; -} - -.ui.message .header + p { - margin-top: 0.25em; -} - -/* List */ - -.ui.message .list:not(.ui) { - text-align: left; - padding: 0; - opacity: 0.85; - list-style-position: inside; - margin: 0.5em 0 0; -} - -.ui.message .list:not(.ui):first-child { - margin-top: 0; -} - -.ui.message .list:not(.ui):last-child { - margin-bottom: 0; -} - -.ui.message .list:not(.ui) li { - position: relative; - list-style-type: none; - margin: 0 0 0.3em 1em; - padding: 0; -} - -.ui.message .list:not(.ui) li:before { - position: absolute; - content: '•'; - left: -1em; - height: 100%; - vertical-align: baseline; -} - -.ui.message .list:not(.ui) li:last-child { - margin-bottom: 0; -} - -/* Icon */ - -.ui.icon.message > .icons, -.ui.icon.message > i.icon { - margin-right: 0.6em; -} - -.ui.icon.message > .icons:last-child, -.ui.icon.message > i.icon:last-child { - margin: 0 0 0 0.6em; -} - -/* Close Icon */ - -.ui.message > .close.icon { - cursor: pointer; - position: absolute; - margin: 0; - top: 0.78575em; - right: 0.5em; - opacity: 0.7; - -webkit-transition: opacity 0.1s ease; - transition: opacity 0.1s ease; -} - -.ui.message > .close.icon:hover { - opacity: 1; -} - -/* First / Last Element */ - -.ui.message > :first-child { - margin-top: 0; -} - -.ui.message > :last-child { - margin-bottom: 0; -} - -/******************************* - Coupling -*******************************/ - -.ui.dropdown .menu > .message { - margin: 0 -1px; -} - -/******************************* - States -*******************************/ - -/*-------------- - Visible ----------------*/ - -.ui.visible.visible.visible.visible.message { - display: block; -} - -.ui.icon.visible.visible.visible.visible.message { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -/*-------------- - Hidden ----------------*/ - -.ui.hidden.hidden.hidden.hidden.message { - display: none; -} - -/******************************* - Variations -*******************************/ - -.ui.centered.message, -.ui.center.aligned.message { - text-align: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; -} - -.ui.centered.message > .content, -.ui.center.aligned.message > .content { - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; -} - -.ui.right.aligned.message { - text-align: right; -} - -/*-------------- - Compact - ---------------*/ - -.ui.compact.message { - display: inline-block; -} - -.ui.compact.icon.message { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - width: auto; -} - -/*-------------- - Attached - ---------------*/ - -.ui.attached.message { - margin-bottom: -1px; - border-radius: 0.33333333rem 0.33333333rem 0 0; - -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; - box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; - margin-left: -1px; - margin-right: -1px; -} - -.ui.attached + .ui.attached.message:not(.top):not(.bottom) { - margin-top: -1px; - border-radius: 0; -} - -.ui.bottom.attached.message { - margin-top: -1px; - border-radius: 0 0 0.33333333rem 0.33333333rem; - -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15); -} - -.ui.bottom.attached.message:not(:last-child) { - margin-bottom: 1em; -} - -.ui.attached.icon.message { - width: auto; -} - -/*-------------- - Icon - ---------------*/ - -.ui.icon.message { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - width: 100%; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.ui.icon.message > .icons, -.ui.icon.message > i.icon:not(.close) { - display: block; - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; - width: auto; - line-height: 1; - vertical-align: middle; - font-size: 3em; - opacity: 0.8; -} - -.ui.icon.message > .content { - display: block; - -webkit-box-flex: 1; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - vertical-align: middle; -} - -.ui.icon.message > .icons + .content, -.ui.icon.message > i.icon:not(.close) + .content { - padding-left: 0; -} - -.ui.icon.message > i.circular { - width: 1em; -} - -/*-------------- - Floating - ---------------*/ - -.ui.floating.message { - -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -/*-------------- - Colors ----------------*/ - -/*-------------- - Types ----------------*/ - -.ui.positive.message { - background-color: #FCFFF5; - color: #2C662D; -} - -.ui.positive.message, -.ui.attached.positive.message { - -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.positive.message { - -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.positive.message .header { - color: #1A531B; -} - -.ui.inverted.positive.message, -.ui.inverted.positive.message .header { - color: #A3C293; -} - -.ui.negative.message { - background-color: #FFF6F6; - color: #9F3A38; -} - -.ui.negative.message, -.ui.attached.negative.message { - -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.negative.message { - -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.negative.message .header { - color: #912D2B; -} - -.ui.inverted.negative.message, -.ui.inverted.negative.message .header { - color: #E0B4B4; -} - -.ui.info.message { - background-color: #F8FFFF; - color: #276F86; -} - -.ui.info.message, -.ui.attached.info.message { - -webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.info.message { - -webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.info.message .header { - color: #0E566C; -} - -.ui.inverted.info.message, -.ui.inverted.info.message .header { - color: #c6e3e9; -} - -.ui.warning.message { - background-color: #FFFAF3; - color: #573A08; -} - -.ui.warning.message, -.ui.attached.warning.message { - -webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.warning.message { - -webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.warning.message .header { - color: #794B02; -} - -.ui.inverted.warning.message, -.ui.inverted.warning.message .header { - color: #d7ccb5; -} - -.ui.error.message { - background-color: #FFF6F6; - color: #9F3A38; -} - -.ui.error.message, -.ui.attached.error.message { - -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #E0B4B4 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.error.message { - -webkit-box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #E0B4B4 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.error.message .header { - color: #912D2B; -} - -.ui.inverted.error.message, -.ui.inverted.error.message .header { - color: #ecd1d1; -} - -.ui.success.message { - background-color: #FCFFF5; - color: #2C662D; -} - -.ui.success.message, -.ui.attached.success.message { - -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #A3C293 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.success.message { - -webkit-box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #A3C293 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.success.message .header { - color: #1A531B; -} - -.ui.inverted.success.message, -.ui.inverted.success.message .header { - color: #b9d1ad; -} - -.ui.primary.message { - background-color: #DFF0FF; - color: rgba(255, 255, 255, 0.9); -} - -.ui.primary.message, -.ui.attached.primary.message { - -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.primary.message { - -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.primary.message .header { - color: rgba(242, 242, 242, 0.9); -} - -.ui.secondary.message { - background-color: #F4F4F4; - color: rgba(255, 255, 255, 0.9); -} - -.ui.secondary.message, -.ui.attached.secondary.message { - -webkit-box-shadow: 0 0 0 1px #1B1C1D inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #1B1C1D inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.secondary.message { - -webkit-box-shadow: 0 0 0 1px #1B1C1D inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #1B1C1D inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.secondary.message .header { - color: rgba(242, 242, 242, 0.9); -} - -.ui.red.message { - background-color: #FFE8E6; - color: #DB2828; -} - -.ui.red.message, -.ui.attached.red.message { - -webkit-box-shadow: 0 0 0 1px #DB2828 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #DB2828 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.red.message { - -webkit-box-shadow: 0 0 0 1px #DB2828 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #DB2828 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.red.message .header { - color: #c82121; -} - -.ui.orange.message { - background-color: #FFEDDE; - color: #F2711C; -} - -.ui.orange.message, -.ui.attached.orange.message { - -webkit-box-shadow: 0 0 0 1px #F2711C inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #F2711C inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.orange.message { - -webkit-box-shadow: 0 0 0 1px #F2711C inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #F2711C inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.orange.message .header { - color: #e7640d; -} - -.ui.yellow.message { - background-color: #FFF8DB; - color: #B58105; -} - -.ui.yellow.message, -.ui.attached.yellow.message { - -webkit-box-shadow: 0 0 0 1px #B58105 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #B58105 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.yellow.message { - -webkit-box-shadow: 0 0 0 1px #B58105 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #B58105 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.yellow.message .header { - color: #9c6f04; -} - -.ui.olive.message { - background-color: #FBFDEF; - color: #8ABC1E; -} - -.ui.olive.message, -.ui.attached.olive.message { - -webkit-box-shadow: 0 0 0 1px #8ABC1E inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #8ABC1E inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.olive.message { - -webkit-box-shadow: 0 0 0 1px #8ABC1E inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #8ABC1E inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.olive.message .header { - color: #7aa61a; -} - -.ui.green.message { - background-color: #E5F9E7; - color: #1EBC30; -} - -.ui.green.message, -.ui.attached.green.message { - -webkit-box-shadow: 0 0 0 1px #1EBC30 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #1EBC30 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.green.message { - -webkit-box-shadow: 0 0 0 1px #1EBC30 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #1EBC30 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.green.message .header { - color: #1aa62a; -} - -.ui.teal.message { - background-color: #E1F7F7; - color: #10A3A3; -} - -.ui.teal.message, -.ui.attached.teal.message { - -webkit-box-shadow: 0 0 0 1px #10A3A3 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #10A3A3 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.teal.message { - -webkit-box-shadow: 0 0 0 1px #10A3A3 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #10A3A3 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.teal.message .header { - color: #0e8c8c; -} - -.ui.blue.message { - background-color: #DFF0FF; - color: #2185D0; -} - -.ui.blue.message, -.ui.attached.blue.message { - -webkit-box-shadow: 0 0 0 1px #2185D0 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #2185D0 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.blue.message { - -webkit-box-shadow: 0 0 0 1px #2185D0 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #2185D0 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.blue.message .header { - color: #1e77ba; -} - -.ui.violet.message { - background-color: #EAE7FF; - color: #6435C9; -} - -.ui.violet.message, -.ui.attached.violet.message { - -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.violet.message { - -webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.violet.message .header { - color: #5a30b5; -} - -.ui.purple.message { - background-color: #F6E7FF; - color: #A333C8; -} - -.ui.purple.message, -.ui.attached.purple.message { - -webkit-box-shadow: 0 0 0 1px #A333C8 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #A333C8 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.purple.message { - -webkit-box-shadow: 0 0 0 1px #A333C8 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #A333C8 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.purple.message .header { - color: #922eb4; -} - -.ui.pink.message { - background-color: #FFE3FB; - color: #E03997; -} - -.ui.pink.message, -.ui.attached.pink.message { - -webkit-box-shadow: 0 0 0 1px #E03997 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #E03997 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.pink.message { - -webkit-box-shadow: 0 0 0 1px #E03997 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #E03997 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.pink.message .header { - color: #dd238b; -} - -.ui.brown.message { - background-color: #F1E2D3; - color: #A5673F; -} - -.ui.brown.message, -.ui.attached.brown.message { - -webkit-box-shadow: 0 0 0 1px #A5673F inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #A5673F inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.brown.message { - -webkit-box-shadow: 0 0 0 1px #A5673F inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #A5673F inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.brown.message .header { - color: #935b38; -} - -.ui.grey.message { - background-color: #F4F4F4; - color: #767676; -} - -.ui.grey.message, -.ui.attached.grey.message { - -webkit-box-shadow: 0 0 0 1px #767676 inset, 0 0 0 0 rgba(0, 0, 0, 0); - box-shadow: 0 0 0 1px #767676 inset, 0 0 0 0 rgba(0, 0, 0, 0); -} - -.ui.floating.grey.message { - -webkit-box-shadow: 0 0 0 1px #767676 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); - box-shadow: 0 0 0 1px #767676 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -} - -.ui.grey.message .header { - color: #696969; -} - -.ui.black.message { - background-color: #1B1C1D; - color: rgba(255, 255, 255, 0.9); -} - -.ui.black.message .header { - color: rgba(255, 255, 255, 0.9); -} - -.ui.inverted.message { - background-color: #1B1C1D; - color: rgba(255, 255, 255, 0.9); -} - -/*-------------- - Sizes ----------------*/ - -.ui.message { - font-size: 1em; -} - -.ui.mini.message { - font-size: 0.75em; -} - -.ui.tiny.message { - font-size: 0.83333333em; -} - -.ui.small.message { - font-size: 0.91666667em; -} - -.ui.large.message { - font-size: 1.16666667em; -} - -.ui.big.message { - font-size: 1.25em; -} - -.ui.huge.message { - font-size: 1.41666667em; -} - -.ui.massive.message { - font-size: 1.75em; -} - -/******************************* - Theme Overrides -*******************************/ - -/******************************* - Site Overrides -*******************************/ -/*! - * # Fomantic-UI 2.8.8 - Tab - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - UI Tabs -*******************************/ - -.ui.tab { - display: none; -} - -/******************************* - States -*******************************/ - -/*-------------------- - Active ----------------------*/ - -.ui.tab.active, -.ui.tab.open { - display: block; -} - -/*-------------------- - Loading - ---------------------*/ - -.ui.tab.loading { - position: relative; - overflow: hidden; - display: block; - min-height: 250px; -} - -.ui.tab.loading * { - position: relative !important; - left: -10000px !important; -} - -.ui.tab.loading:before, -.ui.tab.loading.segment:before { - position: absolute; - content: ''; - top: 50%; - left: 50%; - margin: -1.25em 0 0 -1.25em; - width: 2.5em; - height: 2.5em; - border-radius: 500rem; - border: 0.2em solid rgba(0, 0, 0, 0.1); -} - -.ui.tab.loading:after, -.ui.tab.loading.segment:after { - position: absolute; - content: ''; - top: 50%; - left: 50%; - margin: -1.25em 0 0 -1.25em; - width: 2.5em; - height: 2.5em; - -webkit-animation: loader 0.6s infinite linear; - animation: loader 0.6s infinite linear; - border: 0.2em solid #767676; - border-radius: 500rem; - -webkit-box-shadow: 0 0 0 1px transparent; - box-shadow: 0 0 0 1px transparent; -} - -/******************************* - Tab Overrides -*******************************/ - -/******************************* - User Overrides -*******************************/ /*! * # Fomantic-UI 2.8.8 - Transition * http://github.com/fomantic/Fomantic-UI/ diff --git a/semantic/dist/semantic.js b/semantic/dist/semantic.js index 2fc00c62..fe6fb337 100644 --- a/semantic/dist/semantic.js +++ b/semantic/dist/semantic.js @@ -502,6 +502,1779 @@ $.extend($.expr[ ":" ], { })( jQuery, window, document ); +/*! + * # Fomantic-UI 2.8.8 - Calendar + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +;(function ($, window, document, undefined) { + +'use strict'; + +$.isFunction = $.isFunction || function(obj) { + return typeof obj === "function" && typeof obj.nodeType !== "number"; +}; + +window = (typeof window != 'undefined' && window.Math == Math) + ? window + : (typeof self != 'undefined' && self.Math == Math) + ? self + : Function('return this')() +; + +$.fn.calendar = function(parameters) { + var + $allModules = $(this), + + moduleSelector = $allModules.selector || '', + + time = new Date().getTime(), + performance = [], + + query = arguments[0], + methodInvoked = (typeof query == 'string'), + queryArguments = [].slice.call(arguments, 1), + returnedValue, + timeGapTable = { + '5': {'row': 4, 'column': 3 }, + '10': {'row': 3, 'column': 2 }, + '15': {'row': 2, 'column': 2 }, + '20': {'row': 3, 'column': 1 }, + '30': {'row': 2, 'column': 1 } + }, + numberText = ['','one','two','three','four','five','six','seven','eight'] + ; + + $allModules + .each(function () { + var + settings = ( $.isPlainObject(parameters) ) + ? $.extend(true, {}, $.fn.calendar.settings, parameters) + : $.extend({}, $.fn.calendar.settings), + + className = settings.className, + namespace = settings.namespace, + selector = settings.selector, + formatter = settings.formatter, + parser = settings.parser, + metadata = settings.metadata, + timeGap = timeGapTable[settings.minTimeGap], + error = settings.error, + + eventNamespace = '.' + namespace, + moduleNamespace = 'module-' + namespace, + + $module = $(this), + $input = $module.find(selector.input), + $container = $module.find(selector.popup), + $activator = $module.find(selector.activator), + + element = this, + instance = $module.data(moduleNamespace), + + isTouch, + isTouchDown = false, + isInverted = $module.hasClass(className.inverted), + focusDateUsedForRange = false, + selectionComplete = false, + classObserver, + module + ; + + module = { + + initialize: function () { + module.debug('Initializing calendar for', element, $module); + + isTouch = module.get.isTouch(); + module.setup.config(); + module.setup.popup(); + module.setup.inline(); + module.setup.input(); + module.setup.date(); + module.create.calendar(); + + module.bind.events(); + module.observeChanges(); + module.instantiate(); + }, + + instantiate: function () { + module.verbose('Storing instance of calendar'); + instance = module; + $module.data(moduleNamespace, instance); + }, + + destroy: function () { + module.verbose('Destroying previous calendar for', element); + $module.removeData(moduleNamespace); + module.unbind.events(); + module.disconnect.classObserver(); + }, + + setup: { + config: function () { + if (module.get.minDate() !== null) { + module.set.minDate($module.data(metadata.minDate)); + } + if (module.get.maxDate() !== null) { + module.set.maxDate($module.data(metadata.maxDate)); + } + module.setting('type', module.get.type()); + module.setting('on', settings.on || ($input.length ? 'focus' : 'click')); + }, + popup: function () { + if (settings.inline) { + return; + } + if (!$activator.length) { + $activator = $module.children().first(); + if (!$activator.length) { + return; + } + } + if ($.fn.popup === undefined) { + module.error(error.popup); + return; + } + if (!$container.length) { + //prepend the popup element to the activator's parent so that it has less chance of messing with + //the styling (eg input action button needs to be the last child to have correct border radius) + var $activatorParent = $activator.parent(), + domPositionFunction = $activatorParent.closest(selector.append).length !== 0 ? 'appendTo' : 'prependTo'; + $container = $('
').addClass(className.popup)[domPositionFunction]($activatorParent); + } + $container.addClass(className.calendar); + if(isInverted){ + $container.addClass(className.inverted); + } + var onVisible = function () { + module.refreshTooltips(); + return settings.onVisible.apply($container, arguments); + }; + var onHidden = settings.onHidden; + if (!$input.length) { + //no input, $container has to handle focus/blur + $container.attr('tabindex', '0'); + onVisible = function () { + module.refreshTooltips(); + module.focus(); + return settings.onVisible.apply($container, arguments); + }; + onHidden = function () { + module.blur(); + return settings.onHidden.apply($container, arguments); + }; + } + var onShow = function () { + //reset the focus date onShow + module.set.focusDate(module.get.date()); + module.set.mode(module.get.validatedMode(settings.startMode)); + return settings.onShow.apply($container, arguments); + }; + var on = module.setting('on'); + var options = $.extend({}, settings.popupOptions, { + popup: $container, + on: on, + hoverable: on === 'hover', + closable: on === 'click', + onShow: onShow, + onVisible: onVisible, + onHide: settings.onHide, + onHidden: onHidden + }); + module.popup(options); + }, + inline: function () { + if ($activator.length && !settings.inline) { + return; + } + settings.inline = true; + $container = $('
').addClass(className.calendar).appendTo($module); + if (!$input.length) { + $container.attr('tabindex', '0'); + } + }, + input: function () { + if (settings.touchReadonly && $input.length && isTouch) { + $input.prop('readonly', true); + } + module.check.disabled(); + }, + date: function () { + var date; + if (settings.initialDate) { + date = parser.date(settings.initialDate, settings); + } else if ($module.data(metadata.date) !== undefined) { + date = parser.date($module.data(metadata.date), settings); + } else if ($input.length) { + date = parser.date($input.val(), settings); + } + module.set.date(date, settings.formatInput, false); + module.set.mode(module.get.mode(), false); + } + }, + + trigger: { + change: function() { + var + inputElement = $input[0] + ; + if(inputElement) { + var events = document.createEvent('HTMLEvents'); + module.verbose('Triggering native change event'); + events.initEvent('change', true, false); + inputElement.dispatchEvent(events); + } + } + }, + + create: { + calendar: function () { + var i, r, c, p, row, cell, pageGrid; + + var + mode = module.get.mode(), + today = new Date(), + date = module.get.date(), + focusDate = module.get.focusDate(), + display = module.helper.dateInRange(focusDate || date || settings.initialDate || today) + ; + + if (!focusDate) { + focusDate = display; + module.set.focusDate(focusDate, false, false); + } + + var + isYear = mode === 'year', + isMonth = mode === 'month', + isDay = mode === 'day', + isHour = mode === 'hour', + isMinute = mode === 'minute', + isTimeOnly = settings.type === 'time' + ; + + var multiMonth = Math.max(settings.multiMonth, 1); + var monthOffset = !isDay ? 0 : module.get.monthOffset(); + + var + minute = display.getMinutes(), + hour = display.getHours(), + day = display.getDate(), + startMonth = display.getMonth() + monthOffset, + year = display.getFullYear() + ; + + var columns = isDay ? settings.showWeekNumbers ? 8 : 7 : isHour ? 4 : timeGap['column']; + var rows = isDay || isHour ? 6 : timeGap['row']; + var pages = isDay ? multiMonth : 1; + + var container = $container; + var tooltipPosition = container.hasClass("left") ? "right center" : "left center"; + container.empty(); + if (pages > 1) { + pageGrid = $('
').addClass(className.grid).appendTo(container); + } + + for (p = 0; p < pages; p++) { + if (pages > 1) { + var pageColumn = $('
').addClass(className.column).appendTo(pageGrid); + container = pageColumn; + } + + var month = startMonth + p; + var firstMonthDayColumn = (new Date(year, month, 1).getDay() - settings.firstDayOfWeek % 7 + 7) % 7; + if (!settings.constantHeight && isDay) { + var requiredCells = new Date(year, month + 1, 0).getDate() + firstMonthDayColumn; + rows = Math.ceil(requiredCells / 7); + } + + var + yearChange = isYear ? 10 : isMonth ? 1 : 0, + monthChange = isDay ? 1 : 0, + dayChange = isHour || isMinute ? 1 : 0, + prevNextDay = isHour || isMinute ? day : 1, + prevDate = new Date(year - yearChange, month - monthChange, prevNextDay - dayChange, hour), + nextDate = new Date(year + yearChange, month + monthChange, prevNextDay + dayChange, hour), + prevLast = isYear ? new Date(Math.ceil(year / 10) * 10 - 9, 0, 0) : + isMonth ? new Date(year, 0, 0) : isDay ? new Date(year, month, 0) : new Date(year, month, day, -1), + nextFirst = isYear ? new Date(Math.ceil(year / 10) * 10 + 1, 0, 1) : + isMonth ? new Date(year + 1, 0, 1) : isDay ? new Date(year, month + 1, 1) : new Date(year, month, day + 1) + ; + + var tempMode = mode; + if (isDay && settings.showWeekNumbers){ + tempMode += ' andweek'; + } + var table = $('').addClass(className.table).addClass(tempMode).addClass(numberText[columns] + ' column').appendTo(container); + if(isInverted){ + table.addClass(className.inverted); + } + var textColumns = columns; + //no header for time-only mode + if (!isTimeOnly) { + var thead = $('').appendTo(table); + + row = $('').appendTo(thead); + cell = $('').appendTo(thead); + if(settings.showWeekNumbers) { + cell = $('').appendTo(table); + i = isYear ? Math.ceil(year / 10) * 10 - 9 : isDay ? 1 - firstMonthDayColumn : 0; + for (r = 0; r < rows; r++) { + row = $('').appendTo(tbody); + if(isDay && settings.showWeekNumbers){ + cell = $('').appendTo(tbody); + var todayButton = $('
').attr('colspan', '' + columns).appendTo(row); + + var headerDate = isYear || isMonth ? new Date(year, 0, 1) : + isDay ? new Date(year, month, 1) : new Date(year, month, day, hour, minute); + var headerText = $('').addClass(className.link).appendTo(cell); + headerText.text(formatter.header(headerDate, mode, settings)); + var newMode = isMonth ? (settings.disableYear ? 'day' : 'year') : + isDay ? (settings.disableMonth ? 'year' : 'month') : 'day'; + headerText.data(metadata.mode, newMode); + + if (p === 0) { + var prev = $('').addClass(className.prev).appendTo(cell); + prev.data(metadata.focusDate, prevDate); + prev.toggleClass(className.disabledCell, !module.helper.isDateInRange(prevLast, mode)); + $('').addClass(className.prevIcon).appendTo(prev); + } + + if (p === pages - 1) { + var next = $('').addClass(className.next).appendTo(cell); + next.data(metadata.focusDate, nextDate); + next.toggleClass(className.disabledCell, !module.helper.isDateInRange(nextFirst, mode)); + $('').addClass(className.nextIcon).appendTo(next); + } + if (isDay) { + row = $('
').appendTo(row); + cell.text(settings.text.weekNo); + cell.addClass(className.weekCell); + textColumns--; + } + for (i = 0; i < textColumns; i++) { + cell = $('').appendTo(row); + cell.text(formatter.dayColumnHeader((i + settings.firstDayOfWeek) % 7, settings)); + } + } + } + + var tbody = $('
').appendTo(row); + cell.text(module.get.weekOfYear(year,month,i+1-settings.firstDayOfWeek)); + cell.addClass(className.weekCell); + } + for (c = 0; c < textColumns; c++, i++) { + var cellDate = isYear ? new Date(i, month, 1, hour, minute) : + isMonth ? new Date(year, i, 1, hour, minute) : isDay ? new Date(year, month, i, hour, minute) : + isHour ? new Date(year, month, day, i) : new Date(year, month, day, hour, i * settings.minTimeGap); + var cellText = isYear ? i : + isMonth ? settings.text.monthsShort[i] : isDay ? cellDate.getDate() : + formatter.time(cellDate, settings, true); + cell = $('').addClass(className.cell).appendTo(row); + cell.text(cellText); + cell.data(metadata.date, cellDate); + var adjacent = isDay && cellDate.getMonth() !== ((month + 12) % 12); + var disabled = (!settings.selectAdjacentDays && adjacent) || !module.helper.isDateInRange(cellDate, mode) || settings.isDisabled(cellDate, mode) || module.helper.isDisabled(cellDate, mode) || !module.helper.isEnabled(cellDate, mode); + var eventDate; + if (disabled) { + var disabledDate = module.helper.findDayAsObject(cellDate, mode, settings.disabledDates); + if (disabledDate !== null && disabledDate[metadata.message]) { + cell.attr("data-tooltip", disabledDate[metadata.message]); + cell.attr("data-position", disabledDate[metadata.position] || tooltipPosition); + if(disabledDate[metadata.inverted] || (isInverted && disabledDate[metadata.inverted] === undefined)) { + cell.attr("data-inverted", ''); + } + if(disabledDate[metadata.variation]) { + cell.attr("data-variation", disabledDate[metadata.variation]); + } + } + } else { + eventDate = module.helper.findDayAsObject(cellDate, mode, settings.eventDates); + if (eventDate !== null) { + cell.addClass(eventDate[metadata.class] || settings.eventClass); + if (eventDate[metadata.message]) { + cell.attr("data-tooltip", eventDate[metadata.message]); + cell.attr("data-position", eventDate[metadata.position] || tooltipPosition); + if(eventDate[metadata.inverted] || (isInverted && eventDate[metadata.inverted] === undefined)) { + cell.attr("data-inverted", ''); + } + if(eventDate[metadata.variation]) { + cell.attr("data-variation", eventDate[metadata.variation]); + } + } + } + } + var active = module.helper.dateEqual(cellDate, date, mode); + var isToday = module.helper.dateEqual(cellDate, today, mode); + cell.toggleClass(className.adjacentCell, adjacent && !eventDate); + cell.toggleClass(className.disabledCell, disabled); + cell.toggleClass(className.activeCell, active && !(adjacent && disabled)); + if (!isHour && !isMinute) { + cell.toggleClass(className.todayCell, !adjacent && isToday); + } + + // Allow for external modifications of each cell + var cellOptions = { + mode: mode, + adjacent: adjacent, + disabled: disabled, + active: active, + today: isToday + }; + formatter.cell(cell, cellDate, cellOptions); + + if (module.helper.dateEqual(cellDate, focusDate, mode)) { + //ensure that the focus date is exactly equal to the cell date + //so that, if selected, the correct value is set + module.set.focusDate(cellDate, false, false); + } + } + } + + if (settings.today) { + var todayRow = $('
').attr('colspan', '' + columns).addClass(className.today).appendTo(todayRow); + todayButton.text(formatter.today(settings)); + todayButton.data(metadata.date, today); + } + + module.update.focus(false, table); + + if(settings.inline){ + module.refreshTooltips(); + } + } + } + }, + + update: { + focus: function (updateRange, container) { + container = container || $container; + var mode = module.get.mode(); + var date = module.get.date(); + var focusDate = module.get.focusDate(); + var startDate = module.get.startDate(); + var endDate = module.get.endDate(); + var rangeDate = (updateRange ? focusDate : null) || date || (!isTouch ? focusDate : null); + + container.find('td').each(function () { + var cell = $(this); + var cellDate = cell.data(metadata.date); + if (!cellDate) { + return; + } + var disabled = cell.hasClass(className.disabledCell); + var active = cell.hasClass(className.activeCell); + var adjacent = cell.hasClass(className.adjacentCell); + var focused = module.helper.dateEqual(cellDate, focusDate, mode); + var inRange = !rangeDate ? false : + ((!!startDate && module.helper.isDateInRange(cellDate, mode, startDate, rangeDate)) || + (!!endDate && module.helper.isDateInRange(cellDate, mode, rangeDate, endDate))); + cell.toggleClass(className.focusCell, focused && (!isTouch || isTouchDown) && (!adjacent || (settings.selectAdjacentDays && adjacent)) && !disabled); + + if (module.helper.isTodayButton(cell)) { + return; + } + cell.toggleClass(className.rangeCell, inRange && !active && !disabled); + }); + } + }, + + refresh: function () { + module.create.calendar(); + }, + + refreshTooltips: function() { + var winWidth = $(window).width(); + $container.find('td[data-position]').each(function () { + var cell = $(this); + var tooltipWidth = window.getComputedStyle(cell[0], ':after').width.replace(/[^0-9\.]/g,''); + var tooltipPosition = cell.attr('data-position'); + // use a fallback width of 250 (calendar width) for IE/Edge (which return "auto") + var calcPosition = (winWidth - cell.width() - (parseInt(tooltipWidth,10) || 250)) > cell.offset().left ? 'right' : 'left'; + if(tooltipPosition.indexOf(calcPosition) === -1) { + cell.attr('data-position',tooltipPosition.replace(/(left|right)/,calcPosition)); + } + }); + }, + + bind: { + events: function () { + module.debug('Binding events'); + $container.on('mousedown' + eventNamespace, module.event.mousedown); + $container.on('touchstart' + eventNamespace, module.event.mousedown); + $container.on('mouseup' + eventNamespace, module.event.mouseup); + $container.on('touchend' + eventNamespace, module.event.mouseup); + $container.on('mouseover' + eventNamespace, module.event.mouseover); + if ($input.length) { + $input.on('input' + eventNamespace, module.event.inputChange); + $input.on('focus' + eventNamespace, module.event.inputFocus); + $input.on('blur' + eventNamespace, module.event.inputBlur); + $input.on('keydown' + eventNamespace, module.event.keydown); + } else { + $container.on('keydown' + eventNamespace, module.event.keydown); + } + } + }, + + unbind: { + events: function () { + module.debug('Unbinding events'); + $container.off(eventNamespace); + if ($input.length) { + $input.off(eventNamespace); + } + } + }, + + event: { + mouseover: function (event) { + var target = $(event.target); + var date = target.data(metadata.date); + var mousedown = event.buttons === 1; + if (date) { + module.set.focusDate(date, false, true, mousedown); + } + }, + mousedown: function (event) { + if ($input.length) { + //prevent the mousedown on the calendar causing the input to lose focus + event.preventDefault(); + } + isTouchDown = event.type.indexOf('touch') >= 0; + var target = $(event.target); + var date = target.data(metadata.date); + if (date) { + module.set.focusDate(date, false, true, true); + } + }, + mouseup: function (event) { + //ensure input has focus so that it receives keydown events for calendar navigation + module.focus(); + event.preventDefault(); + event.stopPropagation(); + isTouchDown = false; + var target = $(event.target); + if (target.hasClass("disabled")) { + return; + } + var parent = target.parent(); + if (parent.data(metadata.date) || parent.data(metadata.focusDate) || parent.data(metadata.mode)) { + //clicked on a child element, switch to parent (used when clicking directly on prev/next icon element) + target = parent; + } + var date = target.data(metadata.date); + var focusDate = target.data(metadata.focusDate); + var mode = target.data(metadata.mode); + if (date && settings.onSelect.call(element, date, module.get.mode()) !== false) { + var forceSet = target.hasClass(className.today); + module.selectDate(date, forceSet); + } + else if (focusDate) { + module.set.focusDate(focusDate); + } + else if (mode) { + module.set.mode(mode); + } + }, + keydown: function (event) { + var keyCode = event.which; + if (keyCode === 27 || keyCode === 9) { + //esc || tab + module.popup('hide'); + } + + if (module.popup('is visible')) { + if (keyCode === 37 || keyCode === 38 || keyCode === 39 || keyCode === 40) { + //arrow keys + var mode = module.get.mode(); + var bigIncrement = mode === 'day' ? 7 : mode === 'hour' ? 4 : mode === 'minute' ? timeGap['column'] : 3; + var increment = keyCode === 37 ? -1 : keyCode === 38 ? -bigIncrement : keyCode == 39 ? 1 : bigIncrement; + increment *= mode === 'minute' ? settings.minTimeGap : 1; + var focusDate = module.get.focusDate() || module.get.date() || new Date(); + var year = focusDate.getFullYear() + (mode === 'year' ? increment : 0); + var month = focusDate.getMonth() + (mode === 'month' ? increment : 0); + var day = focusDate.getDate() + (mode === 'day' ? increment : 0); + var hour = focusDate.getHours() + (mode === 'hour' ? increment : 0); + var minute = focusDate.getMinutes() + (mode === 'minute' ? increment : 0); + var newFocusDate = new Date(year, month, day, hour, minute); + if (settings.type === 'time') { + newFocusDate = module.helper.mergeDateTime(focusDate, newFocusDate); + } + if (module.helper.isDateInRange(newFocusDate, mode)) { + module.set.focusDate(newFocusDate); + } + } else if (keyCode === 13) { + //enter + var mode = module.get.mode(); + var date = module.get.focusDate(); + if (date && !settings.isDisabled(date, mode) && !module.helper.isDisabled(date, mode) && module.helper.isEnabled(date, mode)) { + module.selectDate(date); + } + //disable form submission: + event.preventDefault(); + event.stopPropagation(); + } + } + + if (keyCode === 38 || keyCode === 40) { + //arrow-up || arrow-down + event.preventDefault(); //don't scroll + module.popup('show'); + } + }, + inputChange: function () { + var val = $input.val(); + var date = parser.date(val, settings); + module.set.date(date, false); + }, + inputFocus: function () { + $container.addClass(className.active); + }, + inputBlur: function () { + $container.removeClass(className.active); + if (settings.formatInput) { + var date = module.get.date(); + var text = formatter.datetime(date, settings); + $input.val(text); + } + if(selectionComplete){ + module.trigger.change(); + selectionComplete = false; + } + }, + class: { + mutation: function(mutations) { + mutations.forEach(function(mutation) { + if(mutation.attributeName === "class") { + module.check.disabled(); + } + }); + } + } + }, + + observeChanges: function() { + if('MutationObserver' in window) { + classObserver = new MutationObserver(module.event.class.mutation); + module.debug('Setting up mutation observer', classObserver); + module.observe.class(); + } + }, + + disconnect: { + classObserver: function() { + if($input.length && classObserver) { + classObserver.disconnect(); + } + } + }, + + observe: { + class: function() { + if($input.length && classObserver) { + classObserver.observe($module[0], { + attributes : true + }); + } + } + }, + + is: { + disabled: function() { + return $module.hasClass(className.disabled); + } + }, + + check: { + disabled: function(){ + $input.attr('tabindex',module.is.disabled() ? -1 : 0); + } + }, + + get: { + weekOfYear: function(weekYear,weekMonth,weekDay) { + // adapted from http://www.merlyn.demon.co.uk/weekcalc.htm + var ms1d = 864e5, // milliseconds in a day + ms7d = 7 * ms1d; // milliseconds in a week + + return function() { // return a closure so constants get calculated only once + var DC3 = Date.UTC(weekYear, weekMonth, weekDay + 3) / ms1d, // an Absolute Day Number + AWN = Math.floor(DC3 / 7), // an Absolute Week Number + Wyr = new Date(AWN * ms7d).getUTCFullYear(); + + return AWN - Math.floor(Date.UTC(Wyr, 0, 7) / ms7d) + 1; + }(); + }, + date: function () { + return module.helper.sanitiseDate($module.data(metadata.date)) || null; + }, + inputDate: function() { + return $input.val(); + }, + focusDate: function () { + return $module.data(metadata.focusDate) || null; + }, + startDate: function () { + var startModule = module.get.calendarModule(settings.startCalendar); + return (startModule ? startModule.get.date() : $module.data(metadata.startDate)) || null; + }, + endDate: function () { + var endModule = module.get.calendarModule(settings.endCalendar); + return (endModule ? endModule.get.date() : $module.data(metadata.endDate)) || null; + }, + minDate: function() { + return $module.data(metadata.minDate) || null; + }, + maxDate: function() { + return $module.data(metadata.maxDate) || null; + }, + monthOffset: function () { + return $module.data(metadata.monthOffset) || 0; + }, + mode: function () { + //only returns valid modes for the current settings + var mode = $module.data(metadata.mode) || settings.startMode; + return module.get.validatedMode(mode); + }, + validatedMode: function(mode){ + var validModes = module.get.validModes(); + if ($.inArray(mode, validModes) >= 0) { + return mode; + } + return settings.type === 'time' ? 'hour' : + settings.type === 'month' ? 'month' : + settings.type === 'year' ? 'year' : 'day'; + }, + type: function() { + return $module.data(metadata.type) || settings.type; + }, + validModes: function () { + var validModes = []; + if (settings.type !== 'time') { + if (!settings.disableYear || settings.type === 'year') { + validModes.push('year'); + } + if (!(settings.disableMonth || settings.type === 'year') || settings.type === 'month') { + validModes.push('month'); + } + if (settings.type.indexOf('date') >= 0) { + validModes.push('day'); + } + } + if (settings.type.indexOf('time') >= 0) { + validModes.push('hour'); + if (!settings.disableMinute) { + validModes.push('minute'); + } + } + return validModes; + }, + isTouch: function () { + try { + document.createEvent('TouchEvent'); + return true; + } + catch (e) { + return false; + } + }, + calendarModule: function (selector) { + if (!selector) { + return null; + } + if (!(selector instanceof $)) { + selector = $(selector).first(); + } + //assume range related calendars are using the same namespace + return selector.data(moduleNamespace); + } + }, + + set: { + date: function (date, updateInput, fireChange) { + updateInput = updateInput !== false; + fireChange = fireChange !== false; + date = module.helper.sanitiseDate(date); + date = module.helper.dateInRange(date); + + var mode = module.get.mode(); + var text = formatter.datetime(date, settings); + + if (fireChange && settings.onBeforeChange.call(element, date, text, mode) === false) { + return false; + } + + module.set.focusDate(date); + + if (settings.isDisabled(date, mode)) { + return false; + } + + var endDate = module.get.endDate(); + if (!!endDate && !!date && date > endDate) { + //selected date is greater than end date in range, so clear end date + module.set.endDate(undefined); + } + module.set.dataKeyValue(metadata.date, date); + + if (updateInput && $input.length) { + $input.val(text); + } + + if (fireChange) { + settings.onChange.call(element, date, text, mode); + } + }, + startDate: function (date, refreshCalendar) { + date = module.helper.sanitiseDate(date); + var startModule = module.get.calendarModule(settings.startCalendar); + if (startModule) { + startModule.set.date(date); + } + module.set.dataKeyValue(metadata.startDate, date, refreshCalendar); + }, + endDate: function (date, refreshCalendar) { + date = module.helper.sanitiseDate(date); + var endModule = module.get.calendarModule(settings.endCalendar); + if (endModule) { + endModule.set.date(date); + } + module.set.dataKeyValue(metadata.endDate, date, refreshCalendar); + }, + focusDate: function (date, refreshCalendar, updateFocus, updateRange) { + date = module.helper.sanitiseDate(date); + date = module.helper.dateInRange(date); + var isDay = module.get.mode() === 'day'; + var oldFocusDate = module.get.focusDate(); + if (isDay && date && oldFocusDate) { + var yearDelta = date.getFullYear() - oldFocusDate.getFullYear(); + var monthDelta = yearDelta * 12 + date.getMonth() - oldFocusDate.getMonth(); + if (monthDelta) { + var monthOffset = module.get.monthOffset() - monthDelta; + module.set.monthOffset(monthOffset, false); + } + } + var changed = module.set.dataKeyValue(metadata.focusDate, date, !!date && refreshCalendar); + updateFocus = (updateFocus !== false && changed && refreshCalendar === false) || focusDateUsedForRange != updateRange; + focusDateUsedForRange = updateRange; + if (updateFocus) { + module.update.focus(updateRange); + } + }, + minDate: function (date) { + date = module.helper.sanitiseDate(date); + if (settings.maxDate !== null && settings.maxDate <= date) { + module.verbose('Unable to set minDate variable bigger that maxDate variable', date, settings.maxDate); + } else { + module.setting('minDate', date); + module.set.dataKeyValue(metadata.minDate, date); + } + }, + maxDate: function (date) { + date = module.helper.sanitiseDate(date); + if (settings.minDate !== null && settings.minDate >= date) { + module.verbose('Unable to set maxDate variable lower that minDate variable', date, settings.minDate); + } else { + module.setting('maxDate', date); + module.set.dataKeyValue(metadata.maxDate, date); + } + }, + monthOffset: function (monthOffset, refreshCalendar) { + var multiMonth = Math.max(settings.multiMonth, 1); + monthOffset = Math.max(1 - multiMonth, Math.min(0, monthOffset)); + module.set.dataKeyValue(metadata.monthOffset, monthOffset, refreshCalendar); + }, + mode: function (mode, refreshCalendar) { + module.set.dataKeyValue(metadata.mode, mode, refreshCalendar); + }, + dataKeyValue: function (key, value, refreshCalendar) { + var oldValue = $module.data(key); + var equal = oldValue === value || (oldValue <= value && oldValue >= value); //equality test for dates and string objects + if (value) { + $module.data(key, value); + } else { + $module.removeData(key); + } + refreshCalendar = refreshCalendar !== false && !equal; + if (refreshCalendar) { + module.refresh(); + } + return !equal; + } + }, + + selectDate: function (date, forceSet) { + module.verbose('New date selection', date); + var mode = module.get.mode(); + var complete = forceSet || mode === 'minute' || + (settings.disableMinute && mode === 'hour') || + (settings.type === 'date' && mode === 'day') || + (settings.type === 'month' && mode === 'month') || + (settings.type === 'year' && mode === 'year'); + if (complete) { + var canceled = module.set.date(date) === false; + if (!canceled) { + selectionComplete = true; + if(settings.closable) { + module.popup('hide'); + //if this is a range calendar, focus the container or input. This will open the popup from its event listeners. + var endModule = module.get.calendarModule(settings.endCalendar); + if (endModule) { + if (endModule.setting('on') !== 'focus') { + endModule.popup('show'); + } + endModule.focus(); + } + } + } + } else { + var newMode = mode === 'year' ? (!settings.disableMonth ? 'month' : 'day') : + mode === 'month' ? 'day' : mode === 'day' ? 'hour' : 'minute'; + module.set.mode(newMode); + if (mode === 'hour' || (mode === 'day' && module.get.date())) { + //the user has chosen enough to consider a valid date/time has been chosen + module.set.date(date, true, false); + } else { + module.set.focusDate(date); + } + } + }, + + changeDate: function (date) { + module.set.date(date); + }, + + clear: function () { + module.set.date(undefined); + }, + + popup: function () { + return $activator.popup.apply($activator, arguments); + }, + + focus: function () { + if ($input.length) { + $input.focus(); + } else { + $container.focus(); + } + }, + blur: function () { + if ($input.length) { + $input.blur(); + } else { + $container.blur(); + } + }, + + helper: { + isDisabled: function(date, mode) { + return (mode === 'day' || mode === 'month' || mode === 'year') && ((mode === 'day' && settings.disabledDaysOfWeek.indexOf(date.getDay()) !== -1) || settings.disabledDates.some(function(d){ + if(typeof d === 'string') { + d = module.helper.sanitiseDate(d); + } + if (d instanceof Date) { + return module.helper.dateEqual(date, d, mode); + } + if (d !== null && typeof d === 'object') { + if (d[metadata.year]) { + if (typeof d[metadata.year] === 'number') { + return date.getFullYear() == d[metadata.year]; + } else if (Array.isArray(d[metadata.year])) { + return d[metadata.year].indexOf(date.getFullYear()) > -1; + } + } else if (d[metadata.month]) { + if (typeof d[metadata.month] === 'number') { + return date.getMonth() == d[metadata.month]; + } else if (Array.isArray(d[metadata.month])) { + return d[metadata.month].indexOf(date.getMonth()) > -1; + } else if (d[metadata.month] instanceof Date) { + var sdate = module.helper.sanitiseDate(d[metadata.month]); + return (date.getMonth() == sdate.getMonth()) && (date.getFullYear() == sdate.getFullYear()) + } + } else if (d[metadata.date] && mode === 'day') { + if (d[metadata.date] instanceof Date) { + return module.helper.dateEqual(date, module.helper.sanitiseDate(d[metadata.date]), mode); + } else if (Array.isArray(d[metadata.date])) { + return d[metadata.date].some(function(idate) { + return module.helper.dateEqual(date, idate, mode); + }); + } + } + } + })); + }, + isEnabled: function(date, mode) { + if (mode === 'day') { + return settings.enabledDates.length === 0 || settings.enabledDates.some(function(d){ + if(typeof d === 'string') { + d = module.helper.sanitiseDate(d); + } + if (d instanceof Date) { + return module.helper.dateEqual(date, d, mode); + } + if (d !== null && typeof d === 'object' && d[metadata.date]) { + return module.helper.dateEqual(date, module.helper.sanitiseDate(d[metadata.date]), mode); + } + }); + } else { + return true; + } + }, + findDayAsObject: function(date, mode, dates) { + if (mode === 'day' || mode === 'month' || mode === 'year') { + var d; + for (var i = 0; i < dates.length; i++) { + d = dates[i]; + if(typeof d === 'string') { + d = module.helper.sanitiseDate(d); + } + if (d instanceof Date && module.helper.dateEqual(date, d, mode)) { + var dateObject = {}; + dateObject[metadata.date] = d; + return dateObject; + } + else if (d !== null && typeof d === 'object') { + if (d[metadata.year]) { + if (typeof d[metadata.year] === 'number' && date.getFullYear() == d[metadata.year]) { + return d; + } else if (Array.isArray(d[metadata.year])) { + if (d[metadata.year].indexOf(date.getFullYear()) > -1) { + return d; + } + } + } else if (d[metadata.month]) { + if (typeof d[metadata.month] === 'number' && date.getMonth() == d[metadata.month]) { + return d; + } else if (Array.isArray(d[metadata.month])) { + if (d[metadata.month].indexOf(date.getMonth()) > -1) { + return d; + } + } else if (d[metadata.month] instanceof Date) { + var sdate = module.helper.sanitiseDate(d[metadata.month]); + if ((date.getMonth() == sdate.getMonth()) && (date.getFullYear() == sdate.getFullYear())) { + return d; + } + } + } else if (d[metadata.date] && mode === 'day') { + if (d[metadata.date] instanceof Date && module.helper.dateEqual(date, module.helper.sanitiseDate(d[metadata.date]), mode)) { + return d; + } else if (Array.isArray(d[metadata.date])) { + if(d[metadata.date].some(function(idate) { return module.helper.dateEqual(date, idate, mode); })) { + return d; + } + } + } + } + } + } + return null; + }, + sanitiseDate: function (date) { + if (!(date instanceof Date)) { + date = parser.date('' + date, settings); + } + if (!date || isNaN(date.getTime())) { + return null; + } + return date; + }, + dateDiff: function (date1, date2, mode) { + mode = mode || 'day'; + var isTimeOnly = settings.type === 'time'; + var isYear = mode === 'year'; + var isYearOrMonth = isYear || mode === 'month'; + var isMinute = mode === 'minute'; + var isHourOrMinute = isMinute || mode === 'hour'; + //only care about a minute accuracy of settings.minTimeGap + date1 = new Date( + isTimeOnly ? 2000 : date1.getFullYear(), + isTimeOnly ? 0 : isYear ? 0 : date1.getMonth(), + isTimeOnly ? 1 : isYearOrMonth ? 1 : date1.getDate(), + !isHourOrMinute ? 0 : date1.getHours(), + !isMinute ? 0 : settings.minTimeGap * Math.floor(date1.getMinutes() / settings.minTimeGap)); + date2 = new Date( + isTimeOnly ? 2000 : date2.getFullYear(), + isTimeOnly ? 0 : isYear ? 0 : date2.getMonth(), + isTimeOnly ? 1 : isYearOrMonth ? 1 : date2.getDate(), + !isHourOrMinute ? 0 : date2.getHours(), + !isMinute ? 0 : settings.minTimeGap * Math.floor(date2.getMinutes() / settings.minTimeGap)); + return date2.getTime() - date1.getTime(); + }, + dateEqual: function (date1, date2, mode) { + return !!date1 && !!date2 && module.helper.dateDiff(date1, date2, mode) === 0; + }, + isDateInRange: function (date, mode, minDate, maxDate) { + if (!minDate && !maxDate) { + var startDate = module.get.startDate(); + minDate = startDate && settings.minDate ? new Date(Math.max(startDate, settings.minDate)) : startDate || settings.minDate; + maxDate = settings.maxDate; + } + minDate = minDate && new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate(), minDate.getHours(), settings.minTimeGap * Math.ceil(minDate.getMinutes() / settings.minTimeGap)); + return !(!date || + (minDate && module.helper.dateDiff(date, minDate, mode) > 0) || + (maxDate && module.helper.dateDiff(maxDate, date, mode) > 0)); + }, + dateInRange: function (date, minDate, maxDate) { + if (!minDate && !maxDate) { + var startDate = module.get.startDate(); + minDate = startDate && settings.minDate ? new Date(Math.max(startDate, settings.minDate)) : startDate || settings.minDate; + maxDate = settings.maxDate; + } + minDate = minDate && new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate(), minDate.getHours(), settings.minTimeGap * Math.ceil(minDate.getMinutes() / settings.minTimeGap)); + var isTimeOnly = settings.type === 'time'; + return !date ? date : + (minDate && module.helper.dateDiff(date, minDate, 'minute') > 0) ? + (isTimeOnly ? module.helper.mergeDateTime(date, minDate) : minDate) : + (maxDate && module.helper.dateDiff(maxDate, date, 'minute') > 0) ? + (isTimeOnly ? module.helper.mergeDateTime(date, maxDate) : maxDate) : + date; + }, + mergeDateTime: function (date, time) { + return (!date || !time) ? time : + new Date(date.getFullYear(), date.getMonth(), date.getDate(), time.getHours(), time.getMinutes()); + }, + isTodayButton: function(element) { + return element.text() === settings.text.today; + } + }, + + setting: function (name, value) { + module.debug('Changing setting', name, value); + if ($.isPlainObject(name)) { + $.extend(true, settings, name); + } + else if (value !== undefined) { + if ($.isPlainObject(settings[name])) { + $.extend(true, settings[name], value); + } + else { + settings[name] = value; + } + } + else { + return settings[name]; + } + }, + internal: function (name, value) { + if( $.isPlainObject(name) ) { + $.extend(true, module, name); + } + else if(value !== undefined) { + module[name] = value; + } + else { + return module[name]; + } + }, + debug: function () { + if (!settings.silent && settings.debug) { + if (settings.performance) { + module.performance.log(arguments); + } + else { + module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':'); + module.debug.apply(console, arguments); + } + } + }, + verbose: function () { + if (!settings.silent && settings.verbose && settings.debug) { + if (settings.performance) { + module.performance.log(arguments); + } + else { + module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':'); + module.verbose.apply(console, arguments); + } + } + }, + error: function () { + if (!settings.silent) { + module.error = Function.prototype.bind.call(console.error, console, settings.name + ':'); + module.error.apply(console, arguments); + } + }, + performance: { + log: function (message) { + var + currentTime, + executionTime, + previousTime + ; + if (settings.performance) { + currentTime = new Date().getTime(); + previousTime = time || currentTime; + executionTime = currentTime - previousTime; + time = currentTime; + performance.push({ + 'Name': message[0], + 'Arguments': [].slice.call(message, 1) || '', + 'Element': element, + 'Execution Time': executionTime + }); + } + clearTimeout(module.performance.timer); + module.performance.timer = setTimeout(module.performance.display, 500); + }, + display: function () { + var + title = settings.name + ':', + totalTime = 0 + ; + time = false; + clearTimeout(module.performance.timer); + $.each(performance, function (index, data) { + totalTime += data['Execution Time']; + }); + title += ' ' + totalTime + 'ms'; + if (moduleSelector) { + title += ' \'' + moduleSelector + '\''; + } + if ((console.group !== undefined || console.table !== undefined) && performance.length > 0) { + console.groupCollapsed(title); + if (console.table) { + console.table(performance); + } + else { + $.each(performance, function (index, data) { + console.log(data['Name'] + ': ' + data['Execution Time'] + 'ms'); + }); + } + console.groupEnd(); + } + performance = []; + } + }, + invoke: function (query, passedArguments, context) { + var + object = instance, + maxDepth, + found, + response + ; + passedArguments = passedArguments || queryArguments; + context = element || context; + if (typeof query == 'string' && object !== undefined) { + query = query.split(/[\. ]/); + maxDepth = query.length - 1; + $.each(query, function (depth, value) { + var camelCaseValue = (depth != maxDepth) + ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1) + : query + ; + if ($.isPlainObject(object[camelCaseValue]) && (depth != maxDepth)) { + object = object[camelCaseValue]; + } + else if (object[camelCaseValue] !== undefined) { + found = object[camelCaseValue]; + return false; + } + else if ($.isPlainObject(object[value]) && (depth != maxDepth)) { + object = object[value]; + } + else if (object[value] !== undefined) { + found = object[value]; + return false; + } + else { + module.error(error.method, query); + return false; + } + }); + } + if ($.isFunction(found)) { + response = found.apply(context, passedArguments); + } + else if (found !== undefined) { + response = found; + } + if (Array.isArray(returnedValue)) { + returnedValue.push(response); + } + else if (returnedValue !== undefined) { + returnedValue = [returnedValue, response]; + } + else if (response !== undefined) { + returnedValue = response; + } + return found; + } + }; + + if (methodInvoked) { + if (instance === undefined) { + module.initialize(); + } + module.invoke(query); + } + else { + if (instance !== undefined) { + instance.invoke('destroy'); + } + module.initialize(); + } + }) + ; + return (returnedValue !== undefined) + ? returnedValue + : this + ; +}; + +$.fn.calendar.settings = { + + name : 'Calendar', + namespace : 'calendar', + + silent: false, + debug: false, + verbose: false, + performance: false, + + type : 'datetime', // picker type, can be 'datetime', 'date', 'time', 'month', or 'year' + firstDayOfWeek : 0, // day for first day column (0 = Sunday) + constantHeight : true, // add rows to shorter months to keep day calendar height consistent (6 rows) + today : false, // show a 'today/now' button at the bottom of the calendar + closable : true, // close the popup after selecting a date/time + monthFirst : true, // month before day when parsing/converting date from/to text + touchReadonly : true, // set input to readonly on touch devices + inline : false, // create the calendar inline instead of inside a popup + on : null, // when to show the popup (defaults to 'focus' for input, 'click' for others) + initialDate : null, // date to display initially when no date is selected (null = now) + startMode : false, // display mode to start in, can be 'year', 'month', 'day', 'hour', 'minute' (false = 'day') + minDate : null, // minimum date/time that can be selected, dates/times before are disabled + maxDate : null, // maximum date/time that can be selected, dates/times after are disabled + ampm : true, // show am/pm in time mode + disableYear : false, // disable year selection mode + disableMonth : false, // disable month selection mode + disableMinute : false, // disable minute selection mode + formatInput : true, // format the input text upon input blur and module creation + startCalendar : null, // jquery object or selector for another calendar that represents the start date of a date range + endCalendar : null, // jquery object or selector for another calendar that represents the end date of a date range + multiMonth : 1, // show multiple months when in 'day' mode + minTimeGap : 5, + showWeekNumbers : null, // show Number of Week at the very first column of a dayView + disabledDates : [], // specific day(s) which won't be selectable and contain additional information. + disabledDaysOfWeek : [], // day(s) which won't be selectable(s) (0 = Sunday) + enabledDates : [], // specific day(s) which will be selectable, all other days will be disabled + eventDates : [], // specific day(s) which will be shown in a different color and using tooltips + centuryBreak : 60, // starting short year until 99 where it will be assumed to belong to the last century + currentCentury : 2000, // century to be added to 2-digit years (00 to {centuryBreak}-1) + selectAdjacentDays : false, // The calendar can show dates from adjacent month. These adjacent month dates can also be made selectable. + // popup options ('popup', 'on', 'hoverable', and show/hide callbacks are overridden) + popupOptions: { + position: 'bottom left', + lastResort: 'bottom left', + prefer: 'opposite', + hideOnScroll: false + }, + + text: { + days: ['S', 'M', 'T', 'W', 'T', 'F', 'S'], + months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], + monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], + today: 'Today', + now: 'Now', + am: 'AM', + pm: 'PM', + weekNo: 'Week' + }, + + formatter: { + header: function (date, mode, settings) { + return mode === 'year' ? settings.formatter.yearHeader(date, settings) : + mode === 'month' ? settings.formatter.monthHeader(date, settings) : + mode === 'day' ? settings.formatter.dayHeader(date, settings) : + mode === 'hour' ? settings.formatter.hourHeader(date, settings) : + settings.formatter.minuteHeader(date, settings); + }, + yearHeader: function (date, settings) { + var decadeYear = Math.ceil(date.getFullYear() / 10) * 10; + return (decadeYear - 9) + ' - ' + (decadeYear + 2); + }, + monthHeader: function (date, settings) { + return date.getFullYear(); + }, + dayHeader: function (date, settings) { + var month = settings.text.months[date.getMonth()]; + var year = date.getFullYear(); + return month + ' ' + year; + }, + hourHeader: function (date, settings) { + return settings.formatter.date(date, settings); + }, + minuteHeader: function (date, settings) { + return settings.formatter.date(date, settings); + }, + dayColumnHeader: function (day, settings) { + return settings.text.days[day]; + }, + datetime: function (date, settings) { + if (!date) { + return ''; + } + var day = settings.type === 'time' ? '' : settings.formatter.date(date, settings); + var time = settings.type.indexOf('time') < 0 ? '' : settings.formatter.time(date, settings, false); + var separator = settings.type === 'datetime' ? ' ' : ''; + return day + separator + time; + }, + date: function (date, settings) { + if (!date) { + return ''; + } + var day = date.getDate(); + var month = settings.text.months[date.getMonth()]; + var year = date.getFullYear(); + return settings.type === 'year' ? year : + settings.type === 'month' ? month + ' ' + year : + (settings.monthFirst ? month + ' ' + day : day + ' ' + month) + ', ' + year; + }, + time: function (date, settings, forCalendar) { + if (!date) { + return ''; + } + var hour = date.getHours(); + var minute = date.getMinutes(); + var ampm = ''; + if (settings.ampm) { + ampm = ' ' + (hour < 12 ? settings.text.am : settings.text.pm); + hour = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour; + } + return hour + ':' + (minute < 10 ? '0' : '') + minute + ampm; + }, + today: function (settings) { + return settings.type === 'date' ? settings.text.today : settings.text.now; + }, + cell: function (cell, date, cellOptions) { + } + }, + + parser: { + date: function (text, settings) { + if (text instanceof Date) { + return text; + } + if (!text) { + return null; + } + text = String(text).trim(); + if (text.length === 0) { + return null; + } + if(text.match(/^[0-9]{4}[\/\-\.][0-9]{1,2}[\/\-\.][0-9]{1,2}$/)){ + text = text.replace(/[\/\-\.]/g,'/') + ' 00:00:00'; + } + // Reverse date and month in some cases + text = settings.monthFirst || !text.match(/^[0-9]{1,2}[\/\-\.]/) ? text : text.replace(/[\/\-\.]/g,'/').replace(/([0-9]+)\/([0-9]+)/,'$2/$1'); + var textDate = new Date(text); + var numberOnly = text.match(/^[0-9]+$/) !== null; + if(!numberOnly && !isNaN(textDate.getDate())) { + return textDate; + } + text = text.toLowerCase(); + + var i, j, k; + var minute = -1, hour = -1, day = -1, month = -1, year = -1; + var isAm = undefined; + + var isTimeOnly = settings.type === 'time'; + var isDateOnly = settings.type.indexOf('time') < 0; + + var words = text.split(settings.regExp.dateWords), word; + var numbers = text.split(settings.regExp.dateNumbers), number; + + var parts; + var monthString; + + if (!isDateOnly) { + //am/pm + isAm = $.inArray(settings.text.am.toLowerCase(), words) >= 0 ? true : + $.inArray(settings.text.pm.toLowerCase(), words) >= 0 ? false : undefined; + + //time with ':' + for (i = 0; i < numbers.length; i++) { + number = numbers[i]; + if (number.indexOf(':') >= 0) { + if (hour < 0 || minute < 0) { + parts = number.split(':'); + for (k = 0; k < Math.min(2, parts.length); k++) { + j = parseInt(parts[k]); + if (isNaN(j)) { + j = 0; + } + if (k === 0) { + hour = j % 24; + } else { + minute = j % 60; + } + } + } + numbers.splice(i, 1); + } + } + } + + if (!isTimeOnly) { + //textual month + for (i = 0; i < words.length; i++) { + word = words[i]; + if (word.length <= 0) { + continue; + } + for (j = 0; j < settings.text.months.length; j++) { + monthString = settings.text.months[j]; + monthString = monthString.substring(0, word.length).toLowerCase(); + if (monthString === word) { + month = j + 1; + break; + } + } + if (month >= 0) { + break; + } + } + + //year > settings.centuryBreak + for (i = 0; i < numbers.length; i++) { + j = parseInt(numbers[i]); + if (isNaN(j)) { + continue; + } + if (j >= settings.centuryBreak && i === numbers.length-1) { + if (j <= 99) { + j += settings.currentCentury - 100; + } + year = j; + numbers.splice(i, 1); + break; + } + } + + //numeric month + if (month < 0) { + for (i = 0; i < numbers.length; i++) { + k = i > 1 || settings.monthFirst ? i : i === 1 ? 0 : 1; + j = parseInt(numbers[k]); + if (isNaN(j)) { + continue; + } + if (1 <= j && j <= 12) { + month = j; + numbers.splice(k, 1); + break; + } + } + } + + //day + for (i = 0; i < numbers.length; i++) { + j = parseInt(numbers[i]); + if (isNaN(j)) { + continue; + } + if (1 <= j && j <= 31) { + day = j; + numbers.splice(i, 1); + break; + } + } + + //year <= settings.centuryBreak + if (year < 0) { + for (i = numbers.length - 1; i >= 0; i--) { + j = parseInt(numbers[i]); + if (isNaN(j)) { + continue; + } + if (j <= 99) { + j += settings.currentCentury; + } + year = j; + numbers.splice(i, 1); + break; + } + } + } + + if (!isDateOnly) { + //hour + if (hour < 0) { + for (i = 0; i < numbers.length; i++) { + j = parseInt(numbers[i]); + if (isNaN(j)) { + continue; + } + if (0 <= j && j <= 23) { + hour = j; + numbers.splice(i, 1); + break; + } + } + } + + //minute + if (minute < 0) { + for (i = 0; i < numbers.length; i++) { + j = parseInt(numbers[i]); + if (isNaN(j)) { + continue; + } + if (0 <= j && j <= 59) { + minute = j; + numbers.splice(i, 1); + break; + } + } + } + } + + if (minute < 0 && hour < 0 && day < 0 && month < 0 && year < 0) { + return null; + } + + if (minute < 0) { + minute = 0; + } + if (hour < 0) { + hour = 0; + } + if (day < 0) { + day = 1; + } + if (month < 0) { + month = 1; + } + if (year < 0) { + year = new Date().getFullYear(); + } + + if (isAm !== undefined) { + if (isAm) { + if (hour === 12) { + hour = 0; + } + } else if (hour < 12) { + hour += 12; + } + } + + var date = new Date(year, month - 1, day, hour, minute); + if (date.getMonth() !== month - 1 || date.getFullYear() !== year) { + //month or year don't match up, switch to last day of the month + date = new Date(year, month, 0, hour, minute); + } + return isNaN(date.getTime()) ? null : date; + } + }, + + // callback before date is changed, return false to cancel the change + onBeforeChange: function (date, text, mode) { + return true; + }, + + // callback when date changes + onChange: function (date, text, mode) { + }, + + // callback before show animation, return false to prevent show + onShow: function () { + }, + + // callback after show animation + onVisible: function () { + }, + + // callback before hide animation, return false to prevent hide + onHide: function () { + }, + + // callback after hide animation + onHidden: function () { + }, + + // callback before item is selected, return false to prevent selection + onSelect: function (date, mode) { + }, + + // is the given date disabled? + isDisabled: function (date, mode) { + return false; + }, + + selector: { + popup: '.ui.popup', + input: 'input', + activator: 'input', + append: '.inline.field,.inline.fields' + }, + + regExp: { + dateWords: /[^A-Za-z\u00C0-\u024F]+/g, + dateNumbers: /[^\d:]+/g + }, + + error: { + popup: 'UI Popup, a required component is not included in this page', + method: 'The method you called is not defined.' + }, + + className: { + calendar: 'calendar', + active: 'active', + popup: 'ui popup', + grid: 'ui equal width grid', + column: 'column', + table: 'ui celled center aligned unstackable table', + inverted: 'inverted', + prev: 'prev link', + next: 'next link', + prevIcon: 'chevron left icon', + nextIcon: 'chevron right icon', + link: 'link', + cell: 'link', + disabledCell: 'disabled', + weekCell: 'disabled', + adjacentCell: 'adjacent', + activeCell: 'active', + rangeCell: 'range', + focusCell: 'focus', + todayCell: 'today', + today: 'today link', + disabled: 'disabled' + }, + + metadata: { + date: 'date', + focusDate: 'focusDate', + startDate: 'startDate', + endDate: 'endDate', + minDate: 'minDate', + maxDate: 'maxDate', + mode: 'mode', + type: 'type', + monthOffset: 'monthOffset', + message: 'message', + class: 'class', + inverted: 'inverted', + variation: 'variation', + position: 'position', + month: 'month', + year: 'year' + }, + + eventClass: 'blue' +}; + +})(jQuery, window, document); + /*! * # Fomantic-UI 2.8.8 - Dimmer * http://github.com/fomantic/Fomantic-UI/ @@ -5584,6 +7357,2078 @@ $.fn.dropdown.settings.templates = { })( jQuery, window, document ); +/*! + * # Fomantic-UI 2.8.8 - Form Validation + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +;(function ($, window, document, undefined) { + +'use strict'; + +$.isFunction = $.isFunction || function(obj) { + return typeof obj === "function" && typeof obj.nodeType !== "number"; +}; + +window = (typeof window != 'undefined' && window.Math == Math) + ? window + : (typeof self != 'undefined' && self.Math == Math) + ? self + : Function('return this')() +; + +$.fn.form = function(parameters) { + var + $allModules = $(this), + moduleSelector = $allModules.selector || '', + + time = new Date().getTime(), + performance = [], + + query = arguments[0], + legacyParameters = arguments[1], + methodInvoked = (typeof query == 'string'), + queryArguments = [].slice.call(arguments, 1), + returnedValue + ; + $allModules + .each(function() { + var + $module = $(this), + element = this, + + formErrors = [], + keyHeldDown = false, + + // set at run-time + $field, + $group, + $message, + $prompt, + $submit, + $clear, + $reset, + + settings, + validation, + + metadata, + selector, + className, + regExp, + error, + + namespace, + moduleNamespace, + eventNamespace, + + submitting = false, + dirty = false, + history = ['clean', 'clean'], + + instance, + module + ; + + module = { + + initialize: function() { + + // settings grabbed at run time + module.get.settings(); + if(methodInvoked) { + if(instance === undefined) { + module.instantiate(); + } + module.invoke(query); + } + else { + if(instance !== undefined) { + instance.invoke('destroy'); + module.refresh(); + } + module.verbose('Initializing form validation', $module, settings); + module.bindEvents(); + module.set.defaults(); + if (settings.autoCheckRequired) { + module.set.autoCheck(); + } + module.instantiate(); + } + }, + + instantiate: function() { + module.verbose('Storing instance of module', module); + instance = module; + $module + .data(moduleNamespace, module) + ; + }, + + destroy: function() { + module.verbose('Destroying previous module', instance); + module.removeEvents(); + $module + .removeData(moduleNamespace) + ; + }, + + refresh: function() { + module.verbose('Refreshing selector cache'); + $field = $module.find(selector.field); + $group = $module.find(selector.group); + $message = $module.find(selector.message); + $prompt = $module.find(selector.prompt); + + $submit = $module.find(selector.submit); + $clear = $module.find(selector.clear); + $reset = $module.find(selector.reset); + }, + + submit: function() { + module.verbose('Submitting form', $module); + submitting = true; + $module.submit(); + }, + + attachEvents: function(selector, action) { + action = action || 'submit'; + $(selector).on('click' + eventNamespace, function(event) { + module[action](); + event.preventDefault(); + }); + }, + + bindEvents: function() { + module.verbose('Attaching form events'); + $module + .on('submit' + eventNamespace, module.validate.form) + .on('blur' + eventNamespace, selector.field, module.event.field.blur) + .on('click' + eventNamespace, selector.submit, module.submit) + .on('click' + eventNamespace, selector.reset, module.reset) + .on('click' + eventNamespace, selector.clear, module.clear) + ; + if(settings.keyboardShortcuts) { + $module.on('keydown' + eventNamespace, selector.field, module.event.field.keydown); + } + $field.each(function(index, el) { + var + $input = $(el), + type = $input.prop('type'), + inputEvent = module.get.changeEvent(type, $input) + ; + $input.on(inputEvent + eventNamespace, module.event.field.change); + }); + + // Dirty events + if (settings.preventLeaving) { + $(window).on('beforeunload' + eventNamespace, module.event.beforeUnload); + } + + $field.on('change click keyup keydown blur', function(e) { + module.determine.isDirty(); + }); + + $module.on('dirty' + eventNamespace, function(e) { + settings.onDirty.call(); + }); + + $module.on('clean' + eventNamespace, function(e) { + settings.onClean.call(); + }) + }, + + clear: function() { + $field.each(function (index, el) { + var + $field = $(el), + $element = $field.parent(), + $fieldGroup = $field.closest($group), + $prompt = $fieldGroup.find(selector.prompt), + $calendar = $field.closest(selector.uiCalendar), + defaultValue = $field.data(metadata.defaultValue) || '', + isCheckbox = $element.is(selector.uiCheckbox), + isDropdown = $element.is(selector.uiDropdown) && module.can.useElement('dropdown'), + isCalendar = ($calendar.length > 0 && module.can.useElement('calendar')), + isErrored = $fieldGroup.hasClass(className.error) + ; + if(isErrored) { + module.verbose('Resetting error on field', $fieldGroup); + $fieldGroup.removeClass(className.error); + $prompt.remove(); + } + if(isDropdown) { + module.verbose('Resetting dropdown value', $element, defaultValue); + $element.dropdown('clear', true); + } + else if(isCheckbox) { + $field.prop('checked', false); + } + else if (isCalendar) { + $calendar.calendar('clear'); + } + else { + module.verbose('Resetting field value', $field, defaultValue); + $field.val(''); + } + }); + module.remove.states(); + }, + + reset: function() { + $field.each(function (index, el) { + var + $field = $(el), + $element = $field.parent(), + $fieldGroup = $field.closest($group), + $calendar = $field.closest(selector.uiCalendar), + $prompt = $fieldGroup.find(selector.prompt), + defaultValue = $field.data(metadata.defaultValue), + isCheckbox = $element.is(selector.uiCheckbox), + isDropdown = $element.is(selector.uiDropdown) && module.can.useElement('dropdown'), + isCalendar = ($calendar.length > 0 && module.can.useElement('calendar')), + isErrored = $fieldGroup.hasClass(className.error) + ; + if(defaultValue === undefined) { + return; + } + if(isErrored) { + module.verbose('Resetting error on field', $fieldGroup); + $fieldGroup.removeClass(className.error); + $prompt.remove(); + } + if(isDropdown) { + module.verbose('Resetting dropdown value', $element, defaultValue); + $element.dropdown('restore defaults', true); + } + else if(isCheckbox) { + module.verbose('Resetting checkbox value', $element, defaultValue); + $field.prop('checked', defaultValue); + } + else if (isCalendar) { + $calendar.calendar('set date', defaultValue); + } + else { + module.verbose('Resetting field value', $field, defaultValue); + $field.val(defaultValue); + } + }); + module.remove.states(); + }, + + determine: { + isValid: function() { + var + allValid = true + ; + $.each(validation, function(fieldName, field) { + if( !( module.validate.field(field, fieldName, true) ) ) { + allValid = false; + } + }); + return allValid; + }, + isDirty: function(e) { + var formIsDirty = false; + + $field.each(function(index, el) { + var + $el = $(el), + isCheckbox = ($el.filter(selector.checkbox).length > 0), + isDirty + ; + + if (isCheckbox) { + isDirty = module.is.checkboxDirty($el); + } else { + isDirty = module.is.fieldDirty($el); + } + + $el.data(settings.metadata.isDirty, isDirty); + + formIsDirty |= isDirty; + }); + + if (formIsDirty) { + module.set.dirty(); + } else { + module.set.clean(); + } + + } + }, + + is: { + bracketedRule: function(rule) { + return (rule.type && rule.type.match(settings.regExp.bracket)); + }, + // duck type rule test + shorthandRules: function(rules) { + return (typeof rules == 'string' || Array.isArray(rules)); + }, + empty: function($field) { + if(!$field || $field.length === 0) { + return true; + } + else if($field.is(selector.checkbox)) { + return !$field.is(':checked'); + } + else { + return module.is.blank($field); + } + }, + blank: function($field) { + return String($field.val()).trim() === ''; + }, + valid: function(field, showErrors) { + var + allValid = true + ; + if(field) { + module.verbose('Checking if field is valid', field); + return module.validate.field(validation[field], field, !!showErrors); + } + else { + module.verbose('Checking if form is valid'); + $.each(validation, function(fieldName, field) { + if( !module.is.valid(fieldName, showErrors) ) { + allValid = false; + } + }); + return allValid; + } + }, + dirty: function() { + return dirty; + }, + clean: function() { + return !dirty; + }, + fieldDirty: function($el) { + var initialValue = $el.data(metadata.defaultValue); + // Explicitly check for null/undefined here as value may be `false`, so ($el.data(dataInitialValue) || '') would not work + if (initialValue == null) { initialValue = ''; } + else if(Array.isArray(initialValue)) { + initialValue = initialValue.toString(); + } + var currentValue = $el.val(); + if (currentValue == null) { currentValue = ''; } + // multiple select values are returned as arrays which are never equal, so do string conversion first + else if(Array.isArray(currentValue)) { + currentValue = currentValue.toString(); + } + // Boolean values can be encoded as "true/false" or "True/False" depending on underlying frameworks so we need a case insensitive comparison + var boolRegex = /^(true|false)$/i; + var isBoolValue = boolRegex.test(initialValue) && boolRegex.test(currentValue); + if (isBoolValue) { + var regex = new RegExp("^" + initialValue + "$", "i"); + return !regex.test(currentValue); + } + + return currentValue !== initialValue; + }, + checkboxDirty: function($el) { + var initialValue = $el.data(metadata.defaultValue); + var currentValue = $el.is(":checked"); + + return initialValue !== currentValue; + }, + justDirty: function() { + return (history[0] === 'dirty'); + }, + justClean: function() { + return (history[0] === 'clean'); + } + }, + + removeEvents: function() { + $module.off(eventNamespace); + $field.off(eventNamespace); + $submit.off(eventNamespace); + $field.off(eventNamespace); + }, + + event: { + field: { + keydown: function(event) { + var + $field = $(this), + key = event.which, + isInput = $field.is(selector.input), + isCheckbox = $field.is(selector.checkbox), + isInDropdown = ($field.closest(selector.uiDropdown).length > 0), + keyCode = { + enter : 13, + escape : 27 + } + ; + if( key == keyCode.escape) { + module.verbose('Escape key pressed blurring field'); + $field[0] + .blur() + ; + } + if(!event.ctrlKey && key == keyCode.enter && isInput && !isInDropdown && !isCheckbox) { + if(!keyHeldDown) { + $field.one('keyup' + eventNamespace, module.event.field.keyup); + module.submit(); + module.debug('Enter pressed on input submitting form'); + } + keyHeldDown = true; + } + }, + keyup: function() { + keyHeldDown = false; + }, + blur: function(event) { + var + $field = $(this), + $fieldGroup = $field.closest($group), + validationRules = module.get.validation($field) + ; + if(validationRules && (settings.on == 'blur' || ( $fieldGroup.hasClass(className.error) && settings.revalidate) )) { + module.debug('Revalidating field', $field, validationRules); + module.validate.field( validationRules ); + if(!settings.inline) { + module.validate.form(false,true); + } + } + }, + change: function(event) { + var + $field = $(this), + $fieldGroup = $field.closest($group), + validationRules = module.get.validation($field) + ; + if(validationRules && (settings.on == 'change' || ( $fieldGroup.hasClass(className.error) && settings.revalidate) )) { + clearTimeout(module.timer); + module.timer = setTimeout(function() { + module.debug('Revalidating field', $field, validationRules); + module.validate.field( validationRules ); + if(!settings.inline) { + module.validate.form(false,true); + } + }, settings.delay); + } + } + }, + beforeUnload: function(event) { + if (module.is.dirty() && !submitting) { + var event = event || window.event; + + // For modern browsers + if (event) { + event.returnValue = settings.text.leavingMessage; + } + + // For olders... + return settings.text.leavingMessage; + } + } + + }, + + get: { + ancillaryValue: function(rule) { + if(!rule.type || (!rule.value && !module.is.bracketedRule(rule))) { + return false; + } + return (rule.value !== undefined) + ? rule.value + : rule.type.match(settings.regExp.bracket)[1] + '' + ; + }, + ruleName: function(rule) { + if( module.is.bracketedRule(rule) ) { + return rule.type.replace(rule.type.match(settings.regExp.bracket)[0], ''); + } + return rule.type; + }, + changeEvent: function(type, $input) { + if(type == 'checkbox' || type == 'radio' || type == 'hidden' || $input.is('select')) { + return 'change'; + } + else { + return module.get.inputEvent(); + } + }, + inputEvent: function() { + return (document.createElement('input').oninput !== undefined) + ? 'input' + : (document.createElement('input').onpropertychange !== undefined) + ? 'propertychange' + : 'keyup' + ; + }, + fieldsFromShorthand: function(fields) { + var + fullFields = {} + ; + $.each(fields, function(name, rules) { + if (!Array.isArray(rules) && typeof rules === 'object') { + fullFields[name] = rules; + } else { + if (typeof rules == 'string') { + rules = [rules]; + } + fullFields[name] = { + rules: [] + }; + $.each(rules, function (index, rule) { + fullFields[name].rules.push({type: rule}); + }); + } + }); + return fullFields; + }, + prompt: function(rule, field) { + var + ruleName = module.get.ruleName(rule), + ancillary = module.get.ancillaryValue(rule), + $field = module.get.field(field.identifier), + value = $field.val(), + prompt = $.isFunction(rule.prompt) + ? rule.prompt(value) + : rule.prompt || settings.prompt[ruleName] || settings.text.unspecifiedRule, + requiresValue = (prompt.search('{value}') !== -1), + requiresName = (prompt.search('{name}') !== -1), + $label, + name, + parts, + suffixPrompt + ; + if(ancillary && ancillary.indexOf('..') >= 0) { + parts = ancillary.split('..', 2); + if(!rule.prompt) { + suffixPrompt = ( + parts[0] === '' ? settings.prompt.maxValue.replace(/\{ruleValue\}/g,'{max}') : + parts[1] === '' ? settings.prompt.minValue.replace(/\{ruleValue\}/g,'{min}') : + settings.prompt.range + ); + prompt += suffixPrompt.replace(/\{name\}/g, ' ' + settings.text.and); + } + prompt = prompt.replace(/\{min\}/g, parts[0]); + prompt = prompt.replace(/\{max\}/g, parts[1]); + } + if(requiresValue) { + prompt = prompt.replace(/\{value\}/g, $field.val()); + } + if(requiresName) { + $label = $field.closest(selector.group).find('label').eq(0); + name = ($label.length == 1) + ? $label.text() + : $field.prop('placeholder') || settings.text.unspecifiedField + ; + prompt = prompt.replace(/\{name\}/g, name); + } + prompt = prompt.replace(/\{identifier\}/g, field.identifier); + prompt = prompt.replace(/\{ruleValue\}/g, ancillary); + if(!rule.prompt) { + module.verbose('Using default validation prompt for type', prompt, ruleName); + } + return prompt; + }, + settings: function() { + if($.isPlainObject(parameters)) { + var + keys = Object.keys(parameters), + isLegacySettings = (keys.length > 0) + ? (parameters[keys[0]].identifier !== undefined && parameters[keys[0]].rules !== undefined) + : false + ; + if(isLegacySettings) { + // 1.x (ducktyped) + settings = $.extend(true, {}, $.fn.form.settings, legacyParameters); + validation = $.extend({}, $.fn.form.settings.defaults, parameters); + module.error(settings.error.oldSyntax, element); + module.verbose('Extending settings from legacy parameters', validation, settings); + } + else { + // 2.x + if(parameters.fields) { + parameters.fields = module.get.fieldsFromShorthand(parameters.fields); + } + settings = $.extend(true, {}, $.fn.form.settings, parameters); + validation = $.extend({}, $.fn.form.settings.defaults, settings.fields); + module.verbose('Extending settings', validation, settings); + } + } + else { + settings = $.fn.form.settings; + validation = $.fn.form.settings.defaults; + module.verbose('Using default form validation', validation, settings); + } + + // shorthand + namespace = settings.namespace; + metadata = settings.metadata; + selector = settings.selector; + className = settings.className; + regExp = settings.regExp; + error = settings.error; + moduleNamespace = 'module-' + namespace; + eventNamespace = '.' + namespace; + + // grab instance + instance = $module.data(moduleNamespace); + + // refresh selector cache + (instance || module).refresh(); + }, + field: function(identifier) { + module.verbose('Finding field with identifier', identifier); + identifier = module.escape.string(identifier); + var t; + if((t=$field.filter('#' + identifier)).length > 0 ) { + return t; + } + if((t=$field.filter('[name="' + identifier +'"]')).length > 0 ) { + return t; + } + if((t=$field.filter('[name="' + identifier +'[]"]')).length > 0 ) { + return t; + } + if((t=$field.filter('[data-' + metadata.validate + '="'+ identifier +'"]')).length > 0 ) { + return t; + } + return $(''); + }, + fields: function(fields) { + var + $fields = $() + ; + $.each(fields, function(index, name) { + $fields = $fields.add( module.get.field(name) ); + }); + return $fields; + }, + validation: function($field) { + var + fieldValidation, + identifier + ; + if(!validation) { + return false; + } + $.each(validation, function(fieldName, field) { + identifier = field.identifier || fieldName; + $.each(module.get.field(identifier), function(index, groupField) { + if(groupField == $field[0]) { + field.identifier = identifier; + fieldValidation = field; + return false; + } + }); + }); + return fieldValidation || false; + }, + value: function (field) { + var + fields = [], + results + ; + fields.push(field); + results = module.get.values.call(element, fields); + return results[field]; + }, + values: function (fields) { + var + $fields = Array.isArray(fields) + ? module.get.fields(fields) + : $field, + values = {} + ; + $fields.each(function(index, field) { + var + $field = $(field), + $calendar = $field.closest(selector.uiCalendar), + name = $field.prop('name'), + value = $field.val(), + isCheckbox = $field.is(selector.checkbox), + isRadio = $field.is(selector.radio), + isMultiple = (name.indexOf('[]') !== -1), + isCalendar = ($calendar.length > 0 && module.can.useElement('calendar')), + isChecked = (isCheckbox) + ? $field.is(':checked') + : false + ; + if(name) { + if(isMultiple) { + name = name.replace('[]', ''); + if(!values[name]) { + values[name] = []; + } + if(isCheckbox) { + if(isChecked) { + values[name].push(value || true); + } + else { + values[name].push(false); + } + } + else { + values[name].push(value); + } + } + else { + if(isRadio) { + if(values[name] === undefined || values[name] === false) { + values[name] = (isChecked) + ? value || true + : false + ; + } + } + else if(isCheckbox) { + if(isChecked) { + values[name] = value || true; + } + else { + values[name] = false; + } + } + else if(isCalendar) { + var date = $calendar.calendar('get date'); + + if (date !== null) { + if (settings.dateHandling == 'date') { + values[name] = date; + } else if(settings.dateHandling == 'input') { + values[name] = $calendar.calendar('get input date') + } else if (settings.dateHandling == 'formatter') { + var type = $calendar.calendar('setting', 'type'); + + switch(type) { + case 'date': + values[name] = settings.formatter.date(date); + break; + + case 'datetime': + values[name] = settings.formatter.datetime(date); + break; + + case 'time': + values[name] = settings.formatter.time(date); + break; + + case 'month': + values[name] = settings.formatter.month(date); + break; + + case 'year': + values[name] = settings.formatter.year(date); + break; + + default: + module.debug('Wrong calendar mode', $calendar, type); + values[name] = ''; + } + } + } else { + values[name] = ''; + } + } else { + values[name] = value; + } + } + } + }); + return values; + }, + dirtyFields: function() { + return $field.filter(function(index, e) { + return $(e).data(metadata.isDirty); + }); + } + }, + + has: { + + field: function(identifier) { + module.verbose('Checking for existence of a field with identifier', identifier); + identifier = module.escape.string(identifier); + if(typeof identifier !== 'string') { + module.error(error.identifier, identifier); + } + if($field.filter('#' + identifier).length > 0 ) { + return true; + } + else if( $field.filter('[name="' + identifier +'"]').length > 0 ) { + return true; + } + else if( $field.filter('[data-' + metadata.validate + '="'+ identifier +'"]').length > 0 ) { + return true; + } + return false; + } + + }, + + can: { + useElement: function(element){ + if ($.fn[element] !== undefined) { + return true; + } + module.error(error.noElement.replace('{element}',element)); + return false; + } + }, + + escape: { + string: function(text) { + text = String(text); + return text.replace(regExp.escape, '\\$&'); + } + }, + + add: { + // alias + rule: function(name, rules) { + module.add.field(name, rules); + }, + field: function(name, rules) { + // Validation should have at least a standard format + if(validation[name] === undefined || validation[name].rules === undefined) { + validation[name] = { + rules: [] + }; + } + var + newValidation = { + rules: [] + } + ; + if(module.is.shorthandRules(rules)) { + rules = Array.isArray(rules) + ? rules + : [rules] + ; + $.each(rules, function(_index, rule) { + newValidation.rules.push({ type: rule }); + }); + } + else { + newValidation.rules = rules.rules; + } + // For each new rule, check if there's not already one with the same type + $.each(newValidation.rules, function (_index, rule) { + if ($.grep(validation[name].rules, function(item){ return item.type == rule.type; }).length == 0) { + validation[name].rules.push(rule); + } + }); + module.debug('Adding rules', newValidation.rules, validation); + }, + fields: function(fields) { + validation = $.extend({}, validation, module.get.fieldsFromShorthand(fields)); + }, + prompt: function(identifier, errors, internal) { + var + $field = module.get.field(identifier), + $fieldGroup = $field.closest($group), + $prompt = $fieldGroup.children(selector.prompt), + promptExists = ($prompt.length !== 0) + ; + errors = (typeof errors == 'string') + ? [errors] + : errors + ; + module.verbose('Adding field error state', identifier); + if(!internal) { + $fieldGroup + .addClass(className.error) + ; + } + if(settings.inline) { + if(!promptExists) { + $prompt = settings.templates.prompt(errors, className.label); + $prompt + .appendTo($fieldGroup) + ; + } + $prompt + .html(errors[0]) + ; + if(!promptExists) { + if(settings.transition && module.can.useElement('transition') && $module.transition('is supported')) { + module.verbose('Displaying error with css transition', settings.transition); + $prompt.transition(settings.transition + ' in', settings.duration); + } + else { + module.verbose('Displaying error with fallback javascript animation'); + $prompt + .fadeIn(settings.duration) + ; + } + } + else { + module.verbose('Inline errors are disabled, no inline error added', identifier); + } + } + }, + errors: function(errors) { + module.debug('Adding form error messages', errors); + module.set.error(); + $message + .html( settings.templates.error(errors) ) + ; + } + }, + + remove: { + errors: function() { + module.debug('Removing form error messages'); + $message.empty(); + }, + states: function() { + $module.removeClass(className.error).removeClass(className.success); + if(!settings.inline) { + module.remove.errors(); + } + module.determine.isDirty(); + }, + rule: function(field, rule) { + var + rules = Array.isArray(rule) + ? rule + : [rule] + ; + if(validation[field] === undefined || !Array.isArray(validation[field].rules)) { + return; + } + if(rule === undefined) { + module.debug('Removed all rules'); + validation[field].rules = []; + return; + } + $.each(validation[field].rules, function(index, rule) { + if(rule && rules.indexOf(rule.type) !== -1) { + module.debug('Removed rule', rule.type); + validation[field].rules.splice(index, 1); + } + }); + }, + field: function(field) { + var + fields = Array.isArray(field) + ? field + : [field] + ; + $.each(fields, function(index, field) { + module.remove.rule(field); + }); + }, + // alias + rules: function(field, rules) { + if(Array.isArray(field)) { + $.each(field, function(index, field) { + module.remove.rule(field, rules); + }); + } + else { + module.remove.rule(field, rules); + } + }, + fields: function(fields) { + module.remove.field(fields); + }, + prompt: function(identifier) { + var + $field = module.get.field(identifier), + $fieldGroup = $field.closest($group), + $prompt = $fieldGroup.children(selector.prompt) + ; + $fieldGroup + .removeClass(className.error) + ; + if(settings.inline && $prompt.is(':visible')) { + module.verbose('Removing prompt for field', identifier); + if(settings.transition && module.can.useElement('transition') && $module.transition('is supported')) { + $prompt.transition(settings.transition + ' out', settings.duration, function() { + $prompt.remove(); + }); + } + else { + $prompt + .fadeOut(settings.duration, function(){ + $prompt.remove(); + }) + ; + } + } + } + }, + + set: { + success: function() { + $module + .removeClass(className.error) + .addClass(className.success) + ; + }, + defaults: function () { + $field.each(function (index, el) { + var + $el = $(el), + $parent = $el.parent(), + isCheckbox = ($el.filter(selector.checkbox).length > 0), + isDropdown = $parent.is(selector.uiDropdown) && module.can.useElement('dropdown'), + $calendar = $el.closest(selector.uiCalendar), + isCalendar = ($calendar.length > 0 && module.can.useElement('calendar')), + value = (isCheckbox) + ? $el.is(':checked') + : $el.val() + ; + if (isDropdown) { + $parent.dropdown('save defaults'); + } + else if (isCalendar) { + $calendar.calendar('refresh'); + } + $el.data(metadata.defaultValue, value); + $el.data(metadata.isDirty, false); + }); + }, + error: function() { + $module + .removeClass(className.success) + .addClass(className.error) + ; + }, + value: function (field, value) { + var + fields = {} + ; + fields[field] = value; + return module.set.values.call(element, fields); + }, + values: function (fields) { + if($.isEmptyObject(fields)) { + return; + } + $.each(fields, function(key, value) { + var + $field = module.get.field(key), + $element = $field.parent(), + $calendar = $field.closest(selector.uiCalendar), + isMultiple = Array.isArray(value), + isCheckbox = $element.is(selector.uiCheckbox) && module.can.useElement('checkbox'), + isDropdown = $element.is(selector.uiDropdown) && module.can.useElement('dropdown'), + isRadio = ($field.is(selector.radio) && isCheckbox), + isCalendar = ($calendar.length > 0 && module.can.useElement('calendar')), + fieldExists = ($field.length > 0), + $multipleField + ; + if(fieldExists) { + if(isMultiple && isCheckbox) { + module.verbose('Selecting multiple', value, $field); + $element.checkbox('uncheck'); + $.each(value, function(index, value) { + $multipleField = $field.filter('[value="' + value + '"]'); + $element = $multipleField.parent(); + if($multipleField.length > 0) { + $element.checkbox('check'); + } + }); + } + else if(isRadio) { + module.verbose('Selecting radio value', value, $field); + $field.filter('[value="' + value + '"]') + .parent(selector.uiCheckbox) + .checkbox('check') + ; + } + else if(isCheckbox) { + module.verbose('Setting checkbox value', value, $element); + if(value === true || value === 1) { + $element.checkbox('check'); + } + else { + $element.checkbox('uncheck'); + } + } + else if(isDropdown) { + module.verbose('Setting dropdown value', value, $element); + $element.dropdown('set selected', value); + } + else if (isCalendar) { + $calendar.calendar('set date',value); + } + else { + module.verbose('Setting field value', value, $field); + $field.val(value); + } + } + }); + }, + dirty: function() { + module.verbose('Setting state dirty'); + dirty = true; + history[0] = history[1]; + history[1] = 'dirty'; + + if (module.is.justClean()) { + $module.trigger('dirty'); + } + }, + clean: function() { + module.verbose('Setting state clean'); + dirty = false; + history[0] = history[1]; + history[1] = 'clean'; + + if (module.is.justDirty()) { + $module.trigger('clean'); + } + }, + asClean: function() { + module.set.defaults(); + module.set.clean(); + }, + asDirty: function() { + module.set.defaults(); + module.set.dirty(); + }, + autoCheck: function() { + module.debug('Enabling auto check on required fields'); + $field.each(function (_index, el) { + var + $el = $(el), + $elGroup = $(el).closest($group), + isCheckbox = ($el.filter(selector.checkbox).length > 0), + isRequired = $el.prop('required') || $elGroup.hasClass(className.required) || $elGroup.parent().hasClass(className.required), + isDisabled = $el.is(':disabled') || $elGroup.hasClass(className.disabled) || $elGroup.parent().hasClass(className.disabled), + validation = module.get.validation($el), + hasEmptyRule = validation + ? $.grep(validation.rules, function(rule) { return rule.type == "empty" }) !== 0 + : false, + identifier = validation.identifier || $el.attr('id') || $el.attr('name') || $el.data(metadata.validate) + ; + if (isRequired && !isDisabled && !hasEmptyRule && identifier !== undefined) { + if (isCheckbox) { + module.verbose("Adding 'checked' rule on field", identifier); + module.add.rule(identifier, "checked"); + } else { + module.verbose("Adding 'empty' rule on field", identifier); + module.add.rule(identifier, "empty"); + } + } + }); + }, + optional: function(identifier, bool) { + bool = (bool !== false); + $.each(validation, function(fieldName, field) { + if (identifier == fieldName || identifier == field.identifier) { + field.optional = bool; + } + }); + } + }, + + validate: { + + form: function(event, ignoreCallbacks) { + var values = module.get.values(); + + // input keydown event will fire submit repeatedly by browser default + if(keyHeldDown) { + return false; + } + + // reset errors + formErrors = []; + if( module.determine.isValid() ) { + module.debug('Form has no validation errors, submitting'); + module.set.success(); + if(!settings.inline) { + module.remove.errors(); + } + if(ignoreCallbacks !== true) { + return settings.onSuccess.call(element, event, values); + } + } + else { + module.debug('Form has errors'); + submitting = false; + module.set.error(); + if(!settings.inline) { + module.add.errors(formErrors); + } + // prevent ajax submit + if(event && $module.data('moduleApi') !== undefined) { + event.stopImmediatePropagation(); + } + if(settings.errorFocus) { + var focusElement, hasTabIndex = true; + if (typeof settings.errorFocus === 'string') { + focusElement = $(settings.errorFocus); + hasTabIndex = focusElement.is('[tabindex]'); + // to be able to focus/scroll into non input elements we need a tabindex + if (!hasTabIndex) { + focusElement.attr('tabindex',-1); + } + } else { + focusElement = $group.filter('.' + className.error).first().find(selector.field); + } + focusElement.focus(); + // only remove tabindex if it was dynamically created above + if (!hasTabIndex){ + focusElement.removeAttr('tabindex'); + } + } + if(ignoreCallbacks !== true) { + return settings.onFailure.call(element, formErrors, values); + } + } + }, + + // takes a validation object and returns whether field passes validation + field: function(field, fieldName, showErrors) { + showErrors = (showErrors !== undefined) + ? showErrors + : true + ; + if(typeof field == 'string') { + module.verbose('Validating field', field); + fieldName = field; + field = validation[field]; + } + var + identifier = field.identifier || fieldName, + $field = module.get.field(identifier), + $dependsField = (field.depends) + ? module.get.field(field.depends) + : false, + fieldValid = true, + fieldErrors = [] + ; + if(!field.identifier) { + module.debug('Using field name as identifier', identifier); + field.identifier = identifier; + } + var isDisabled = !$field.filter(':not(:disabled)').length; + if(isDisabled) { + module.debug('Field is disabled. Skipping', identifier); + } + else if(field.optional && module.is.blank($field)){ + module.debug('Field is optional and blank. Skipping', identifier); + } + else if(field.depends && module.is.empty($dependsField)) { + module.debug('Field depends on another value that is not present or empty. Skipping', $dependsField); + } + else if(field.rules !== undefined) { + if(showErrors) { + $field.closest($group).removeClass(className.error); + } + $.each(field.rules, function(index, rule) { + if( module.has.field(identifier)) { + var invalidFields = module.validate.rule(field, rule,true) || []; + if (invalidFields.length>0){ + module.debug('Field is invalid', identifier, rule.type); + fieldErrors.push(module.get.prompt(rule, field)); + fieldValid = false; + if(showErrors){ + $(invalidFields).closest($group).addClass(className.error); + } + } + } + }); + } + if(fieldValid) { + if(showErrors) { + module.remove.prompt(identifier, fieldErrors); + settings.onValid.call($field); + } + } + else { + if(showErrors) { + formErrors = formErrors.concat(fieldErrors); + module.add.prompt(identifier, fieldErrors, true); + settings.onInvalid.call($field, fieldErrors); + } + return false; + } + return true; + }, + + // takes validation rule and returns whether field passes rule + rule: function(field, rule, internal) { + var + $field = module.get.field(field.identifier), + ancillary = module.get.ancillaryValue(rule), + ruleName = module.get.ruleName(rule), + ruleFunction = settings.rules[ruleName], + invalidFields = [], + isCheckbox = $field.is(selector.checkbox), + isValid = function(field){ + var value = (isCheckbox ? $(field).filter(':checked').val() : $(field).val()); + // cast to string avoiding encoding special values + value = (value === undefined || value === '' || value === null) + ? '' + : (settings.shouldTrim && rule.shouldTrim !== false) || rule.shouldTrim ? String(value + '').trim() : String(value + '') + ; + return ruleFunction.call(field, value, ancillary, $module); + } + ; + if( !$.isFunction(ruleFunction) ) { + module.error(error.noRule, ruleName); + return; + } + if(isCheckbox) { + if (!isValid($field)) { + invalidFields = $field; + } + } else { + $.each($field, function (index, field) { + if (!isValid(field)) { + invalidFields.push(field); + } + }); + } + return internal ? invalidFields : !(invalidFields.length>0); + } + }, + + setting: function(name, value) { + if( $.isPlainObject(name) ) { + $.extend(true, settings, name); + } + else if(value !== undefined) { + settings[name] = value; + } + else { + return settings[name]; + } + }, + internal: function(name, value) { + if( $.isPlainObject(name) ) { + $.extend(true, module, name); + } + else if(value !== undefined) { + module[name] = value; + } + else { + return module[name]; + } + }, + debug: function() { + if(!settings.silent && settings.debug) { + if(settings.performance) { + module.performance.log(arguments); + } + else { + module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':'); + module.debug.apply(console, arguments); + } + } + }, + verbose: function() { + if(!settings.silent && settings.verbose && settings.debug) { + if(settings.performance) { + module.performance.log(arguments); + } + else { + module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':'); + module.verbose.apply(console, arguments); + } + } + }, + error: function() { + if(!settings.silent) { + module.error = Function.prototype.bind.call(console.error, console, settings.name + ':'); + module.error.apply(console, arguments); + } + }, + performance: { + log: function(message) { + var + currentTime, + executionTime, + previousTime + ; + if(settings.performance) { + currentTime = new Date().getTime(); + previousTime = time || currentTime; + executionTime = currentTime - previousTime; + time = currentTime; + performance.push({ + 'Name' : message[0], + 'Arguments' : [].slice.call(message, 1) || '', + 'Element' : element, + 'Execution Time' : executionTime + }); + } + clearTimeout(module.performance.timer); + module.performance.timer = setTimeout(module.performance.display, 500); + }, + display: function() { + var + title = settings.name + ':', + totalTime = 0 + ; + time = false; + clearTimeout(module.performance.timer); + $.each(performance, function(index, data) { + totalTime += data['Execution Time']; + }); + title += ' ' + totalTime + 'ms'; + if(moduleSelector) { + title += ' \'' + moduleSelector + '\''; + } + if($allModules.length > 1) { + title += ' ' + '(' + $allModules.length + ')'; + } + if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { + console.groupCollapsed(title); + if(console.table) { + console.table(performance); + } + else { + $.each(performance, function(index, data) { + console.log(data['Name'] + ': ' + data['Execution Time']+'ms'); + }); + } + console.groupEnd(); + } + performance = []; + } + }, + invoke: function(query, passedArguments, context) { + var + object = instance, + maxDepth, + found, + response + ; + passedArguments = passedArguments || queryArguments; + context = element || context; + if(typeof query == 'string' && object !== undefined) { + query = query.split(/[\. ]/); + maxDepth = query.length - 1; + $.each(query, function(depth, value) { + var camelCaseValue = (depth != maxDepth) + ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1) + : query + ; + if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) { + object = object[camelCaseValue]; + } + else if( object[camelCaseValue] !== undefined ) { + found = object[camelCaseValue]; + return false; + } + else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) { + object = object[value]; + } + else if( object[value] !== undefined ) { + found = object[value]; + return false; + } + else { + return false; + } + }); + } + if( $.isFunction( found ) ) { + response = found.apply(context, passedArguments); + } + else if(found !== undefined) { + response = found; + } + if(Array.isArray(returnedValue)) { + returnedValue.push(response); + } + else if(returnedValue !== undefined) { + returnedValue = [returnedValue, response]; + } + else if(response !== undefined) { + returnedValue = response; + } + return found; + } + }; + module.initialize(); + }) + ; + + return (returnedValue !== undefined) + ? returnedValue + : this + ; +}; + +$.fn.form.settings = { + + name : 'Form', + namespace : 'form', + + debug : false, + verbose : false, + performance : true, + + fields : false, + + keyboardShortcuts : true, + on : 'submit', + inline : false, + + delay : 200, + revalidate : true, + shouldTrim : true, + + transition : 'scale', + duration : 200, + + autoCheckRequired : false, + preventLeaving : false, + errorFocus : false, + dateHandling : 'date', // 'date', 'input', 'formatter' + + onValid : function() {}, + onInvalid : function() {}, + onSuccess : function() { return true; }, + onFailure : function() { return false; }, + onDirty : function() {}, + onClean : function() {}, + + metadata : { + defaultValue : 'default', + validate : 'validate', + isDirty : 'isDirty' + }, + + regExp: { + htmlID : /^[a-zA-Z][\w:.-]*$/g, + bracket : /\[(.*)\]/i, + decimal : /^\d+\.?\d*$/, + email : /^[a-z0-9!#$%&'*+\/=?^_`{|}~.-]+@[a-z0-9]([a-z0-9-]*[a-z0-9])?(\.[a-z0-9]([a-z0-9-]*[a-z0-9])?)*$/i, + escape : /[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|:,=@]/g, + flags : /^\/(.*)\/(.*)?/, + integer : /^\-?\d+$/, + number : /^\-?\d*(\.\d+)?$/, + url : /(https?:\/\/(?:www\.|(?!www))[^\s\.]+\.[^\s]{2,}|www\.[^\s]+\.[^\s]{2,})/i + }, + + text: { + and : 'and', + unspecifiedRule : 'Please enter a valid value', + unspecifiedField : 'This field', + leavingMessage : 'There are unsaved changes on this page which will be discarded if you continue.' + }, + + prompt: { + range : '{name} must be in a range from {min} to {max}', + maxValue : '{name} must have a maximum value of {ruleValue}', + minValue : '{name} must have a minimum value of {ruleValue}', + empty : '{name} must have a value', + checked : '{name} must be checked', + email : '{name} must be a valid e-mail', + url : '{name} must be a valid url', + regExp : '{name} is not formatted correctly', + integer : '{name} must be an integer', + decimal : '{name} must be a decimal number', + number : '{name} must be set to a number', + is : '{name} must be "{ruleValue}"', + isExactly : '{name} must be exactly "{ruleValue}"', + not : '{name} cannot be set to "{ruleValue}"', + notExactly : '{name} cannot be set to exactly "{ruleValue}"', + contain : '{name} must contain "{ruleValue}"', + containExactly : '{name} must contain exactly "{ruleValue}"', + doesntContain : '{name} cannot contain "{ruleValue}"', + doesntContainExactly : '{name} cannot contain exactly "{ruleValue}"', + minLength : '{name} must be at least {ruleValue} characters', + length : '{name} must be at least {ruleValue} characters', + exactLength : '{name} must be exactly {ruleValue} characters', + maxLength : '{name} cannot be longer than {ruleValue} characters', + match : '{name} must match {ruleValue} field', + different : '{name} must have a different value than {ruleValue} field', + creditCard : '{name} must be a valid credit card number', + minCount : '{name} must have at least {ruleValue} choices', + exactCount : '{name} must have exactly {ruleValue} choices', + maxCount : '{name} must have {ruleValue} or less choices' + }, + + selector : { + checkbox : 'input[type="checkbox"], input[type="radio"]', + clear : '.clear', + field : 'input:not(.search):not([type="file"]), textarea, select', + group : '.field', + input : 'input:not([type="file"])', + message : '.error.message', + prompt : '.prompt.label', + radio : 'input[type="radio"]', + reset : '.reset:not([type="reset"])', + submit : '.submit:not([type="submit"])', + uiCheckbox : '.ui.checkbox', + uiDropdown : '.ui.dropdown', + uiCalendar : '.ui.calendar' + }, + + className : { + error : 'error', + label : 'ui basic red pointing prompt label', + pressed : 'down', + success : 'success', + required : 'required', + disabled : 'disabled' + }, + + error: { + identifier : 'You must specify a string identifier for each field', + method : 'The method you called is not defined.', + noRule : 'There is no rule matching the one you specified', + oldSyntax : 'Starting in 2.0 forms now only take a single settings object. Validation settings converted to new syntax automatically.', + noElement : 'This module requires ui {element}' + }, + + templates: { + + // template that produces error message + error: function(errors) { + var + html = '
    ' + ; + $.each(errors, function(index, value) { + html += '
  • ' + value + '
  • '; + }); + html += '
'; + return $(html); + }, + + // template that produces label + prompt: function(errors, labelClasses) { + return $('
') + .addClass(labelClasses) + .html(errors[0]) + ; + } + }, + + formatter: { + date: function(date) { + return Intl.DateTimeFormat('en-GB').format(date); + }, + datetime: function(date) { + return Intl.DateTimeFormat('en-GB', { + year: "numeric", + month: "2-digit", + day: "2-digit", + hour: '2-digit', + minute: '2-digit', + second: '2-digit' + }).format(date); + }, + time: function(date) { + return Intl.DateTimeFormat('en-GB', { + hour: '2-digit', + minute: '2-digit', + second: '2-digit' + }).format(date); + }, + month: function(date) { + return Intl.DateTimeFormat('en-GB', { + month: '2-digit', + year: 'numeric' + }).format(date); + }, + year: function(date) { + return Intl.DateTimeFormat('en-GB', { + year: 'numeric' + }).format(date); + } + }, + + rules: { + + // is not empty or blank string + empty: function(value) { + return !(value === undefined || '' === value || Array.isArray(value) && value.length === 0); + }, + + // checkbox checked + checked: function() { + return ($(this).filter(':checked').length > 0); + }, + + // is most likely an email + email: function(value){ + return $.fn.form.settings.regExp.email.test(value); + }, + + // value is most likely url + url: function(value) { + return $.fn.form.settings.regExp.url.test(value); + }, + + // matches specified regExp + regExp: function(value, regExp) { + if(regExp instanceof RegExp) { + return value.match(regExp); + } + var + regExpParts = regExp.match($.fn.form.settings.regExp.flags), + flags + ; + // regular expression specified as /baz/gi (flags) + if(regExpParts) { + regExp = (regExpParts.length >= 2) + ? regExpParts[1] + : regExp + ; + flags = (regExpParts.length >= 3) + ? regExpParts[2] + : '' + ; + } + return value.match( new RegExp(regExp, flags) ); + }, + minValue: function(value, range) { + return $.fn.form.settings.rules.range(value, range+'..', 'number'); + }, + maxValue: function(value, range) { + return $.fn.form.settings.rules.range(value, '..'+range, 'number'); + }, + // is valid integer or matches range + integer: function(value, range) { + return $.fn.form.settings.rules.range(value, range, 'integer'); + }, + range: function(value, range, regExp) { + if(typeof regExp == "string") { + regExp = $.fn.form.settings.regExp[regExp]; + } + if(!(regExp instanceof RegExp)) { + regExp = $.fn.form.settings.regExp.integer; + } + var + min, + max, + parts + ; + if( !range || ['', '..'].indexOf(range) !== -1) { + // do nothing + } + else if(range.indexOf('..') == -1) { + if(regExp.test(range)) { + min = max = range - 0; + } + } + else { + parts = range.split('..', 2); + if(regExp.test(parts[0])) { + min = parts[0] - 0; + } + if(regExp.test(parts[1])) { + max = parts[1] - 0; + } + } + return ( + regExp.test(value) && + (min === undefined || value >= min) && + (max === undefined || value <= max) + ); + }, + + // is valid number (with decimal) + decimal: function(value, range) { + return $.fn.form.settings.rules.range(value, range, 'decimal'); + }, + + // is valid number + number: function(value, range) { + return $.fn.form.settings.rules.range(value, range, 'number'); + }, + + // is value (case insensitive) + is: function(value, text) { + text = (typeof text == 'string') + ? text.toLowerCase() + : text + ; + value = (typeof value == 'string') + ? value.toLowerCase() + : value + ; + return (value == text); + }, + + // is value + isExactly: function(value, text) { + return (value == text); + }, + + // value is not another value (case insensitive) + not: function(value, notValue) { + value = (typeof value == 'string') + ? value.toLowerCase() + : value + ; + notValue = (typeof notValue == 'string') + ? notValue.toLowerCase() + : notValue + ; + return (value != notValue); + }, + + // value is not another value (case sensitive) + notExactly: function(value, notValue) { + return (value != notValue); + }, + + // value contains text (insensitive) + contains: function(value, text) { + // escape regex characters + text = text.replace($.fn.form.settings.regExp.escape, "\\$&"); + return (value.search( new RegExp(text, 'i') ) !== -1); + }, + + // value contains text (case sensitive) + containsExactly: function(value, text) { + // escape regex characters + text = text.replace($.fn.form.settings.regExp.escape, "\\$&"); + return (value.search( new RegExp(text) ) !== -1); + }, + + // value contains text (insensitive) + doesntContain: function(value, text) { + // escape regex characters + text = text.replace($.fn.form.settings.regExp.escape, "\\$&"); + return (value.search( new RegExp(text, 'i') ) === -1); + }, + + // value contains text (case sensitive) + doesntContainExactly: function(value, text) { + // escape regex characters + text = text.replace($.fn.form.settings.regExp.escape, "\\$&"); + return (value.search( new RegExp(text) ) === -1); + }, + + // is at least string length + minLength: function(value, requiredLength) { + return (value !== undefined) + ? (value.length >= requiredLength) + : false + ; + }, + + // see rls notes for 2.0.6 (this is a duplicate of minLength) + length: function(value, requiredLength) { + return (value !== undefined) + ? (value.length >= requiredLength) + : false + ; + }, + + // is exactly length + exactLength: function(value, requiredLength) { + return (value !== undefined) + ? (value.length == requiredLength) + : false + ; + }, + + // is less than length + maxLength: function(value, maxLength) { + return (value !== undefined) + ? (value.length <= maxLength) + : false + ; + }, + + // matches another field + match: function(value, identifier, $module) { + var + matchingValue, + matchingElement + ; + if((matchingElement = $module.find('[data-validate="'+ identifier +'"]')).length > 0 ) { + matchingValue = matchingElement.val(); + } + else if((matchingElement = $module.find('#' + identifier)).length > 0) { + matchingValue = matchingElement.val(); + } + else if((matchingElement = $module.find('[name="' + identifier +'"]')).length > 0) { + matchingValue = matchingElement.val(); + } + else if((matchingElement = $module.find('[name="' + identifier +'[]"]')).length > 0 ) { + matchingValue = matchingElement; + } + return (matchingValue !== undefined) + ? ( value.toString() == matchingValue.toString() ) + : false + ; + }, + + // different than another field + different: function(value, identifier, $module) { + // use either id or name of field + var + matchingValue, + matchingElement + ; + if((matchingElement = $module.find('[data-validate="'+ identifier +'"]')).length > 0 ) { + matchingValue = matchingElement.val(); + } + else if((matchingElement = $module.find('#' + identifier)).length > 0) { + matchingValue = matchingElement.val(); + } + else if((matchingElement = $module.find('[name="' + identifier +'"]')).length > 0) { + matchingValue = matchingElement.val(); + } + else if((matchingElement = $module.find('[name="' + identifier +'[]"]')).length > 0 ) { + matchingValue = matchingElement; + } + return (matchingValue !== undefined) + ? ( value.toString() !== matchingValue.toString() ) + : false + ; + }, + + creditCard: function(cardNumber, cardTypes) { + var + cards = { + visa: { + pattern : /^4/, + length : [16] + }, + amex: { + pattern : /^3[47]/, + length : [15] + }, + mastercard: { + pattern : /^5[1-5]/, + length : [16] + }, + discover: { + pattern : /^(6011|622(12[6-9]|1[3-9][0-9]|[2-8][0-9]{2}|9[0-1][0-9]|92[0-5]|64[4-9])|65)/, + length : [16] + }, + unionPay: { + pattern : /^(62|88)/, + length : [16, 17, 18, 19] + }, + jcb: { + pattern : /^35(2[89]|[3-8][0-9])/, + length : [16] + }, + maestro: { + pattern : /^(5018|5020|5038|6304|6759|676[1-3])/, + length : [12, 13, 14, 15, 16, 17, 18, 19] + }, + dinersClub: { + pattern : /^(30[0-5]|^36)/, + length : [14] + }, + laser: { + pattern : /^(6304|670[69]|6771)/, + length : [16, 17, 18, 19] + }, + visaElectron: { + pattern : /^(4026|417500|4508|4844|491(3|7))/, + length : [16] + } + }, + valid = {}, + validCard = false, + requiredTypes = (typeof cardTypes == 'string') + ? cardTypes.split(',') + : false, + unionPay, + validation + ; + + if(typeof cardNumber !== 'string' || cardNumber.length === 0) { + return; + } + + // allow dashes and spaces in card + cardNumber = cardNumber.replace(/[\s\-]/g, ''); + + // verify card types + if(requiredTypes) { + $.each(requiredTypes, function(index, type){ + // verify each card type + validation = cards[type]; + if(validation) { + valid = { + length : ($.inArray(cardNumber.length, validation.length) !== -1), + pattern : (cardNumber.search(validation.pattern) !== -1) + }; + if(valid.length && valid.pattern) { + validCard = true; + } + } + }); + + if(!validCard) { + return false; + } + } + + // skip luhn for UnionPay + unionPay = { + number : ($.inArray(cardNumber.length, cards.unionPay.length) !== -1), + pattern : (cardNumber.search(cards.unionPay.pattern) !== -1) + }; + if(unionPay.number && unionPay.pattern) { + return true; + } + + // verify luhn, adapted from + var + length = cardNumber.length, + multiple = 0, + producedValue = [ + [0, 1, 2, 3, 4, 5, 6, 7, 8, 9], + [0, 2, 4, 6, 8, 1, 3, 5, 7, 9] + ], + sum = 0 + ; + while (length--) { + sum += producedValue[multiple][parseInt(cardNumber.charAt(length), 10)]; + multiple ^= 1; + } + return (sum % 10 === 0 && sum > 0); + }, + + minCount: function(value, minCount) { + if(minCount == 0) { + return true; + } + if(minCount == 1) { + return (value !== ''); + } + return (value.split(',').length >= minCount); + }, + + exactCount: function(value, exactCount) { + if(exactCount == 0) { + return (value === ''); + } + if(exactCount == 1) { + return (value !== '' && value.search(',') === -1); + } + return (value.split(',').length == exactCount); + }, + + maxCount: function(value, maxCount) { + if(maxCount == 0) { + return false; + } + if(maxCount == 1) { + return (value.search(',') === -1); + } + return (value.split(',').length <= maxCount); + } + } + +}; + +})( jQuery, window, document ); + /*! * # Fomantic-UI 2.8.8 - Modal * http://github.com/fomantic/Fomantic-UI/ @@ -7035,6 +10880,1548 @@ $.fn.modal.settings.templates = { } } +})( jQuery, window, document ); + +/*! + * # Fomantic-UI 2.8.8 - Popup + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +;(function ($, window, document, undefined) { + +'use strict'; + +$.isFunction = $.isFunction || function(obj) { + return typeof obj === "function" && typeof obj.nodeType !== "number"; +}; + +window = (typeof window != 'undefined' && window.Math == Math) + ? window + : (typeof self != 'undefined' && self.Math == Math) + ? self + : Function('return this')() +; + +$.fn.popup = function(parameters) { + var + $allModules = $(this), + $document = $(document), + $window = $(window), + $body = $('body'), + + moduleSelector = $allModules.selector || '', + + clickEvent = ('ontouchstart' in document.documentElement) + ? 'touchstart' + : 'click', + + time = new Date().getTime(), + performance = [], + + query = arguments[0], + methodInvoked = (typeof query == 'string'), + queryArguments = [].slice.call(arguments, 1), + + returnedValue + ; + $allModules + .each(function() { + var + settings = ( $.isPlainObject(parameters) ) + ? $.extend(true, {}, $.fn.popup.settings, parameters) + : $.extend({}, $.fn.popup.settings), + + selector = settings.selector, + className = settings.className, + error = settings.error, + metadata = settings.metadata, + namespace = settings.namespace, + + eventNamespace = '.' + settings.namespace, + moduleNamespace = 'module-' + namespace, + + $module = $(this), + $context = $(settings.context), + $scrollContext = $(settings.scrollContext), + $boundary = $(settings.boundary), + $target = (settings.target) + ? $(settings.target) + : $module, + + $popup, + $offsetParent, + + searchDepth = 0, + triedPositions = false, + openedWithTouch = false, + + element = this, + instance = $module.data(moduleNamespace), + + documentObserver, + elementNamespace, + id, + module + ; + + module = { + + // binds events + initialize: function() { + module.debug('Initializing', $module); + module.createID(); + module.bind.events(); + if(!module.exists() && settings.preserve) { + module.create(); + } + if(settings.observeChanges) { + module.observeChanges(); + } + module.instantiate(); + }, + + instantiate: function() { + module.verbose('Storing instance', module); + instance = module; + $module + .data(moduleNamespace, instance) + ; + }, + + observeChanges: function() { + if('MutationObserver' in window) { + documentObserver = new MutationObserver(module.event.documentChanged); + documentObserver.observe(document, { + childList : true, + subtree : true + }); + module.debug('Setting up mutation observer', documentObserver); + } + }, + + refresh: function() { + if(settings.popup) { + $popup = $(settings.popup).eq(0); + } + else { + if(settings.inline) { + $popup = $target.nextAll(selector.popup).eq(0); + settings.popup = $popup; + } + } + if(settings.popup) { + $popup.addClass(className.loading); + $offsetParent = module.get.offsetParent(); + $popup.removeClass(className.loading); + if(settings.movePopup && module.has.popup() && module.get.offsetParent($popup)[0] !== $offsetParent[0]) { + module.debug('Moving popup to the same offset parent as target'); + $popup + .detach() + .appendTo($offsetParent) + ; + } + } + else { + $offsetParent = (settings.inline) + ? module.get.offsetParent($target) + : module.has.popup() + ? module.get.offsetParent($popup) + : $body + ; + } + if( $offsetParent.is('html') && $offsetParent[0] !== $body[0] ) { + module.debug('Setting page as offset parent'); + $offsetParent = $body; + } + if( module.get.variation() ) { + module.set.variation(); + } + }, + + reposition: function() { + module.refresh(); + module.set.position(); + }, + + destroy: function() { + module.debug('Destroying previous module'); + if(documentObserver) { + documentObserver.disconnect(); + } + // remove element only if was created dynamically + if($popup && !settings.preserve) { + module.removePopup(); + } + // clear all timeouts + clearTimeout(module.hideTimer); + clearTimeout(module.showTimer); + // remove events + module.unbind.close(); + module.unbind.events(); + $module + .removeData(moduleNamespace) + ; + }, + + event: { + start: function(event) { + var + delay = ($.isPlainObject(settings.delay)) + ? settings.delay.show + : settings.delay + ; + clearTimeout(module.hideTimer); + if(!openedWithTouch || (openedWithTouch && settings.addTouchEvents) ) { + module.showTimer = setTimeout(module.show, delay); + } + }, + end: function() { + var + delay = ($.isPlainObject(settings.delay)) + ? settings.delay.hide + : settings.delay + ; + clearTimeout(module.showTimer); + module.hideTimer = setTimeout(module.hide, delay); + }, + touchstart: function(event) { + openedWithTouch = true; + if(settings.addTouchEvents) { + module.show(); + } + }, + resize: function() { + if( module.is.visible() ) { + module.set.position(); + } + }, + documentChanged: function(mutations) { + [].forEach.call(mutations, function(mutation) { + if(mutation.removedNodes) { + [].forEach.call(mutation.removedNodes, function(node) { + if(node == element || $(node).find(element).length > 0) { + module.debug('Element removed from DOM, tearing down events'); + module.destroy(); + } + }); + } + }); + }, + hideGracefully: function(event) { + var + $target = $(event.target), + isInDOM = $.contains(document.documentElement, event.target), + inPopup = ($target.closest(selector.popup).length > 0) + ; + // don't close on clicks inside popup + if(event && !inPopup && isInDOM) { + module.debug('Click occurred outside popup hiding popup'); + module.hide(); + } + else { + module.debug('Click was inside popup, keeping popup open'); + } + } + }, + + // generates popup html from metadata + create: function() { + var + html = module.get.html(), + title = module.get.title(), + content = module.get.content() + ; + + if(html || content || title) { + module.debug('Creating pop-up html'); + if(!html) { + html = settings.templates.popup({ + title : title, + content : content + }); + } + $popup = $('
') + .addClass(className.popup) + .data(metadata.activator, $module) + .html(html) + ; + if(settings.inline) { + module.verbose('Inserting popup element inline', $popup); + $popup + .insertAfter($module) + ; + } + else { + module.verbose('Appending popup element to body', $popup); + $popup + .appendTo( $context ) + ; + } + module.refresh(); + module.set.variation(); + + if(settings.hoverable) { + module.bind.popup(); + } + settings.onCreate.call($popup, element); + } + else if(settings.popup) { + $(settings.popup).data(metadata.activator, $module); + module.verbose('Used popup specified in settings'); + module.refresh(); + if(settings.hoverable) { + module.bind.popup(); + } + } + else if($target.next(selector.popup).length !== 0) { + module.verbose('Pre-existing popup found'); + settings.inline = true; + settings.popup = $target.next(selector.popup).data(metadata.activator, $module); + module.refresh(); + if(settings.hoverable) { + module.bind.popup(); + } + } + else { + module.debug('No content specified skipping display', element); + } + }, + + createID: function() { + id = (Math.random().toString(16) + '000000000').substr(2, 8); + elementNamespace = '.' + id; + module.verbose('Creating unique id for element', id); + }, + + // determines popup state + toggle: function() { + module.debug('Toggling pop-up'); + if( module.is.hidden() ) { + module.debug('Popup is hidden, showing pop-up'); + module.unbind.close(); + module.show(); + } + else { + module.debug('Popup is visible, hiding pop-up'); + module.hide(); + } + }, + + show: function(callback) { + callback = callback || function(){}; + module.debug('Showing pop-up', settings.transition); + if(module.is.hidden() && !( module.is.active() && module.is.dropdown()) ) { + if( !module.exists() ) { + module.create(); + } + if(settings.onShow.call($popup, element) === false) { + module.debug('onShow callback returned false, cancelling popup animation'); + return; + } + else if(!settings.preserve && !settings.popup) { + module.refresh(); + } + if( $popup && module.set.position() ) { + module.save.conditions(); + if(settings.exclusive) { + module.hideAll(); + } + module.animate.show(callback); + } + } + }, + + + hide: function(callback) { + callback = callback || function(){}; + if( module.is.visible() || module.is.animating() ) { + if(settings.onHide.call($popup, element) === false) { + module.debug('onHide callback returned false, cancelling popup animation'); + return; + } + module.remove.visible(); + module.unbind.close(); + module.restore.conditions(); + module.animate.hide(callback); + } + }, + + hideAll: function() { + $(selector.popup) + .filter('.' + className.popupVisible) + .each(function() { + $(this) + .data(metadata.activator) + .popup('hide') + ; + }) + ; + }, + exists: function() { + if(!$popup) { + return false; + } + if(settings.inline || settings.popup) { + return ( module.has.popup() ); + } + else { + return ( $popup.closest($context).length >= 1 ) + ? true + : false + ; + } + }, + + removePopup: function() { + if( module.has.popup() && !settings.popup) { + module.debug('Removing popup', $popup); + $popup.remove(); + $popup = undefined; + settings.onRemove.call($popup, element); + } + }, + + save: { + conditions: function() { + module.cache = { + title: $module.attr('title') + }; + if (module.cache.title) { + $module.removeAttr('title'); + } + module.verbose('Saving original attributes', module.cache.title); + } + }, + restore: { + conditions: function() { + if(module.cache && module.cache.title) { + $module.attr('title', module.cache.title); + module.verbose('Restoring original attributes', module.cache.title); + } + return true; + } + }, + supports: { + svg: function() { + return (typeof SVGGraphicsElement !== 'undefined'); + } + }, + animate: { + show: function(callback) { + callback = $.isFunction(callback) ? callback : function(){}; + if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) { + module.set.visible(); + $popup + .transition({ + animation : (settings.transition.showMethod || settings.transition) + ' in', + queue : false, + debug : settings.debug, + verbose : settings.verbose, + duration : settings.transition.showDuration || settings.duration, + onComplete : function() { + module.bind.close(); + callback.call($popup, element); + settings.onVisible.call($popup, element); + } + }) + ; + } + else { + module.error(error.noTransition); + } + }, + hide: function(callback) { + callback = $.isFunction(callback) ? callback : function(){}; + module.debug('Hiding pop-up'); + if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) { + $popup + .transition({ + animation : (settings.transition.hideMethod || settings.transition) + ' out', + queue : false, + duration : settings.transition.hideDuration || settings.duration, + debug : settings.debug, + verbose : settings.verbose, + onComplete : function() { + module.reset(); + callback.call($popup, element); + settings.onHidden.call($popup, element); + } + }) + ; + } + else { + module.error(error.noTransition); + } + } + }, + + change: { + content: function(html) { + $popup.html(html); + } + }, + + get: { + html: function() { + $module.removeData(metadata.html); + return $module.data(metadata.html) || settings.html; + }, + title: function() { + $module.removeData(metadata.title); + return $module.data(metadata.title) || settings.title; + }, + content: function() { + $module.removeData(metadata.content); + return $module.data(metadata.content) || settings.content || $module.attr('title'); + }, + variation: function() { + $module.removeData(metadata.variation); + return $module.data(metadata.variation) || settings.variation; + }, + popup: function() { + return $popup; + }, + popupOffset: function() { + return $popup.offset(); + }, + calculations: function() { + var + $popupOffsetParent = module.get.offsetParent($popup), + targetElement = $target[0], + isWindow = ($boundary[0] == window), + targetOffset = $target.offset(), + parentOffset = settings.inline || (settings.popup && settings.movePopup) + ? $target.offsetParent().offset() + : { top: 0, left: 0 }, + screenPosition = (isWindow) + ? { top: 0, left: 0 } + : $boundary.offset(), + calculations = {}, + scroll = (isWindow) + ? { top: $window.scrollTop(), left: $window.scrollLeft() } + : { top: 0, left: 0}, + screen + ; + calculations = { + // element which is launching popup + target : { + element : $target[0], + width : $target.outerWidth(), + height : $target.outerHeight(), + top : targetOffset.top - parentOffset.top, + left : targetOffset.left - parentOffset.left, + margin : {} + }, + // popup itself + popup : { + width : $popup.outerWidth(), + height : $popup.outerHeight() + }, + // offset container (or 3d context) + parent : { + width : $offsetParent.outerWidth(), + height : $offsetParent.outerHeight() + }, + // screen boundaries + screen : { + top : screenPosition.top, + left : screenPosition.left, + scroll: { + top : scroll.top, + left : scroll.left + }, + width : $boundary.width(), + height : $boundary.height() + } + }; + + // if popup offset context is not same as target, then adjust calculations + if($popupOffsetParent.get(0) !== $offsetParent.get(0)) { + var + popupOffset = $popupOffsetParent.offset() + ; + calculations.target.top -= popupOffset.top; + calculations.target.left -= popupOffset.left; + calculations.parent.width = $popupOffsetParent.outerWidth(); + calculations.parent.height = $popupOffsetParent.outerHeight(); + } + + // add in container calcs if fluid + if( settings.setFluidWidth && module.is.fluid() ) { + calculations.container = { + width: $popup.parent().outerWidth() + }; + calculations.popup.width = calculations.container.width; + } + + // add in margins if inline + calculations.target.margin.top = (settings.inline) + ? parseInt( window.getComputedStyle(targetElement).getPropertyValue('margin-top'), 10) + : 0 + ; + calculations.target.margin.left = (settings.inline) + ? module.is.rtl() + ? parseInt( window.getComputedStyle(targetElement).getPropertyValue('margin-right'), 10) + : parseInt( window.getComputedStyle(targetElement).getPropertyValue('margin-left'), 10) + : 0 + ; + // calculate screen boundaries + screen = calculations.screen; + calculations.boundary = { + top : screen.top + screen.scroll.top, + bottom : screen.top + screen.scroll.top + screen.height, + left : screen.left + screen.scroll.left, + right : screen.left + screen.scroll.left + screen.width + }; + return calculations; + }, + id: function() { + return id; + }, + startEvent: function() { + if(settings.on == 'hover') { + return 'mouseenter'; + } + else if(settings.on == 'focus') { + return 'focus'; + } + return false; + }, + scrollEvent: function() { + return 'scroll'; + }, + endEvent: function() { + if(settings.on == 'hover') { + return 'mouseleave'; + } + else if(settings.on == 'focus') { + return 'blur'; + } + return false; + }, + distanceFromBoundary: function(offset, calculations) { + var + distanceFromBoundary = {}, + popup, + boundary + ; + calculations = calculations || module.get.calculations(); + + // shorthand + popup = calculations.popup; + boundary = calculations.boundary; + + if(offset) { + distanceFromBoundary = { + top : (offset.top - boundary.top), + left : (offset.left - boundary.left), + right : (boundary.right - (offset.left + popup.width) ), + bottom : (boundary.bottom - (offset.top + popup.height) ) + }; + module.verbose('Distance from boundaries determined', offset, distanceFromBoundary); + } + return distanceFromBoundary; + }, + offsetParent: function($element) { + var + element = ($element !== undefined) + ? $element[0] + : $target[0], + parentNode = element.parentNode, + $node = $(parentNode) + ; + if(parentNode) { + var + is2D = ($node.css('transform') === 'none'), + isStatic = ($node.css('position') === 'static'), + isBody = $node.is('body') + ; + while(parentNode && !isBody && isStatic && is2D) { + parentNode = parentNode.parentNode; + $node = $(parentNode); + is2D = ($node.css('transform') === 'none'); + isStatic = ($node.css('position') === 'static'); + isBody = $node.is('body'); + } + } + return ($node && $node.length > 0) + ? $node + : $() + ; + }, + positions: function() { + return { + 'top left' : false, + 'top center' : false, + 'top right' : false, + 'bottom left' : false, + 'bottom center' : false, + 'bottom right' : false, + 'left center' : false, + 'right center' : false + }; + }, + nextPosition: function(position) { + var + positions = position.split(' '), + verticalPosition = positions[0], + horizontalPosition = positions[1], + opposite = { + top : 'bottom', + bottom : 'top', + left : 'right', + right : 'left' + }, + adjacent = { + left : 'center', + center : 'right', + right : 'left' + }, + backup = { + 'top left' : 'top center', + 'top center' : 'top right', + 'top right' : 'right center', + 'right center' : 'bottom right', + 'bottom right' : 'bottom center', + 'bottom center' : 'bottom left', + 'bottom left' : 'left center', + 'left center' : 'top left' + }, + adjacentsAvailable = (verticalPosition == 'top' || verticalPosition == 'bottom'), + oppositeTried = false, + adjacentTried = false, + nextPosition = false + ; + if(!triedPositions) { + module.verbose('All available positions available'); + triedPositions = module.get.positions(); + } + + module.debug('Recording last position tried', position); + triedPositions[position] = true; + + if(settings.prefer === 'opposite') { + nextPosition = [opposite[verticalPosition], horizontalPosition]; + nextPosition = nextPosition.join(' '); + oppositeTried = (triedPositions[nextPosition] === true); + module.debug('Trying opposite strategy', nextPosition); + } + if((settings.prefer === 'adjacent') && adjacentsAvailable ) { + nextPosition = [verticalPosition, adjacent[horizontalPosition]]; + nextPosition = nextPosition.join(' '); + adjacentTried = (triedPositions[nextPosition] === true); + module.debug('Trying adjacent strategy', nextPosition); + } + if(adjacentTried || oppositeTried) { + module.debug('Using backup position', nextPosition); + nextPosition = backup[position]; + } + return nextPosition; + } + }, + + set: { + position: function(position, calculations) { + + // exit conditions + if($target.length === 0 || $popup.length === 0) { + module.error(error.notFound); + return; + } + var + offset, + distanceAway, + target, + popup, + parent, + positioning, + popupOffset, + distanceFromBoundary + ; + + calculations = calculations || module.get.calculations(); + position = position || $module.data(metadata.position) || settings.position; + + offset = $module.data(metadata.offset) || settings.offset; + distanceAway = settings.distanceAway; + + // shorthand + target = calculations.target; + popup = calculations.popup; + parent = calculations.parent; + + if(module.should.centerArrow(calculations)) { + module.verbose('Adjusting offset to center arrow on small target element'); + if(position == 'top left' || position == 'bottom left') { + offset += (target.width / 2); + offset -= settings.arrowPixelsFromEdge; + } + if(position == 'top right' || position == 'bottom right') { + offset -= (target.width / 2); + offset += settings.arrowPixelsFromEdge; + } + } + + if(target.width === 0 && target.height === 0 && !module.is.svg(target.element)) { + module.debug('Popup target is hidden, no action taken'); + return false; + } + + if(settings.inline) { + module.debug('Adding margin to calculation', target.margin); + if(position == 'left center' || position == 'right center') { + offset += target.margin.top; + distanceAway += -target.margin.left; + } + else if (position == 'top left' || position == 'top center' || position == 'top right') { + offset += target.margin.left; + distanceAway -= target.margin.top; + } + else { + offset += target.margin.left; + distanceAway += target.margin.top; + } + } + + module.debug('Determining popup position from calculations', position, calculations); + + if (module.is.rtl()) { + position = position.replace(/left|right/g, function (match) { + return (match == 'left') + ? 'right' + : 'left' + ; + }); + module.debug('RTL: Popup position updated', position); + } + + // if last attempt use specified last resort position + if(searchDepth == settings.maxSearchDepth && typeof settings.lastResort === 'string') { + position = settings.lastResort; + } + + switch (position) { + case 'top left': + positioning = { + top : 'auto', + bottom : parent.height - target.top + distanceAway, + left : target.left + offset, + right : 'auto' + }; + break; + case 'top center': + positioning = { + bottom : parent.height - target.top + distanceAway, + left : target.left + (target.width / 2) - (popup.width / 2) + offset, + top : 'auto', + right : 'auto' + }; + break; + case 'top right': + positioning = { + bottom : parent.height - target.top + distanceAway, + right : parent.width - target.left - target.width - offset, + top : 'auto', + left : 'auto' + }; + break; + case 'left center': + positioning = { + top : target.top + (target.height / 2) - (popup.height / 2) + offset, + right : parent.width - target.left + distanceAway, + left : 'auto', + bottom : 'auto' + }; + break; + case 'right center': + positioning = { + top : target.top + (target.height / 2) - (popup.height / 2) + offset, + left : target.left + target.width + distanceAway, + bottom : 'auto', + right : 'auto' + }; + break; + case 'bottom left': + positioning = { + top : target.top + target.height + distanceAway, + left : target.left + offset, + bottom : 'auto', + right : 'auto' + }; + break; + case 'bottom center': + positioning = { + top : target.top + target.height + distanceAway, + left : target.left + (target.width / 2) - (popup.width / 2) + offset, + bottom : 'auto', + right : 'auto' + }; + break; + case 'bottom right': + positioning = { + top : target.top + target.height + distanceAway, + right : parent.width - target.left - target.width - offset, + left : 'auto', + bottom : 'auto' + }; + break; + } + if(positioning === undefined) { + module.error(error.invalidPosition, position); + } + + module.debug('Calculated popup positioning values', positioning); + + // tentatively place on stage + $popup + .css(positioning) + .removeClass(className.position) + .addClass(position) + .addClass(className.loading) + ; + + popupOffset = module.get.popupOffset(); + + // see if any boundaries are surpassed with this tentative position + distanceFromBoundary = module.get.distanceFromBoundary(popupOffset, calculations); + + if(!settings.forcePosition && module.is.offstage(distanceFromBoundary, position) ) { + module.debug('Position is outside viewport', position); + if(searchDepth < settings.maxSearchDepth) { + searchDepth++; + position = module.get.nextPosition(position); + module.debug('Trying new position', position); + return ($popup) + ? module.set.position(position, calculations) + : false + ; + } + else { + if(settings.lastResort) { + module.debug('No position found, showing with last position'); + } + else { + module.debug('Popup could not find a position to display', $popup); + module.error(error.cannotPlace, element); + module.remove.attempts(); + module.remove.loading(); + module.reset(); + settings.onUnplaceable.call($popup, element); + return false; + } + } + } + module.debug('Position is on stage', position); + module.remove.attempts(); + module.remove.loading(); + if( settings.setFluidWidth && module.is.fluid() ) { + module.set.fluidWidth(calculations); + } + return true; + }, + + fluidWidth: function(calculations) { + calculations = calculations || module.get.calculations(); + module.debug('Automatically setting element width to parent width', calculations.parent.width); + $popup.css('width', calculations.container.width); + }, + + variation: function(variation) { + variation = variation || module.get.variation(); + if(variation && module.has.popup() ) { + module.verbose('Adding variation to popup', variation); + $popup.addClass(variation); + } + }, + + visible: function() { + $module.addClass(className.visible); + } + }, + + remove: { + loading: function() { + $popup.removeClass(className.loading); + }, + variation: function(variation) { + variation = variation || module.get.variation(); + if(variation) { + module.verbose('Removing variation', variation); + $popup.removeClass(variation); + } + }, + visible: function() { + $module.removeClass(className.visible); + }, + attempts: function() { + module.verbose('Resetting all searched positions'); + searchDepth = 0; + triedPositions = false; + } + }, + + bind: { + events: function() { + module.debug('Binding popup events to module'); + if(settings.on == 'click') { + $module + .on(clickEvent + eventNamespace, module.toggle) + ; + } + if(settings.on == 'hover') { + $module + .on('touchstart' + eventNamespace, module.event.touchstart) + ; + } + if( module.get.startEvent() ) { + $module + .on(module.get.startEvent() + eventNamespace, module.event.start) + .on(module.get.endEvent() + eventNamespace, module.event.end) + ; + } + if(settings.target) { + module.debug('Target set to element', $target); + } + $window.on('resize' + elementNamespace, module.event.resize); + }, + popup: function() { + module.verbose('Allowing hover events on popup to prevent closing'); + if( $popup && module.has.popup() ) { + $popup + .on('mouseenter' + eventNamespace, module.event.start) + .on('mouseleave' + eventNamespace, module.event.end) + ; + } + }, + close: function() { + if(settings.hideOnScroll === true || (settings.hideOnScroll == 'auto' && settings.on != 'click')) { + module.bind.closeOnScroll(); + } + if(module.is.closable()) { + module.bind.clickaway(); + } + else if(settings.on == 'hover' && openedWithTouch) { + module.bind.touchClose(); + } + }, + closeOnScroll: function() { + module.verbose('Binding scroll close event to document'); + $scrollContext + .one(module.get.scrollEvent() + elementNamespace, module.event.hideGracefully) + ; + }, + touchClose: function() { + module.verbose('Binding popup touchclose event to document'); + $document + .on('touchstart' + elementNamespace, function(event) { + module.verbose('Touched away from popup'); + module.event.hideGracefully.call(element, event); + }) + ; + }, + clickaway: function() { + module.verbose('Binding popup close event to document'); + $document + .on(clickEvent + elementNamespace, function(event) { + module.verbose('Clicked away from popup'); + module.event.hideGracefully.call(element, event); + }) + ; + } + }, + + unbind: { + events: function() { + $window + .off(elementNamespace) + ; + $module + .off(eventNamespace) + ; + }, + close: function() { + $document + .off(elementNamespace) + ; + $scrollContext + .off(elementNamespace) + ; + }, + }, + + has: { + popup: function() { + return ($popup && $popup.length > 0); + } + }, + + should: { + centerArrow: function(calculations) { + return !module.is.basic() && calculations.target.width <= (settings.arrowPixelsFromEdge * 2); + }, + }, + + is: { + closable: function() { + if(settings.closable == 'auto') { + if(settings.on == 'hover') { + return false; + } + return true; + } + return settings.closable; + }, + offstage: function(distanceFromBoundary, position) { + var + offstage = [] + ; + // return boundaries that have been surpassed + $.each(distanceFromBoundary, function(direction, distance) { + if(distance < -settings.jitter) { + module.debug('Position exceeds allowable distance from edge', direction, distance, position); + offstage.push(direction); + } + }); + if(offstage.length > 0) { + return true; + } + else { + return false; + } + }, + svg: function(element) { + return module.supports.svg() && (element instanceof SVGGraphicsElement); + }, + basic: function() { + return $module.hasClass(className.basic); + }, + active: function() { + return $module.hasClass(className.active); + }, + animating: function() { + return ($popup !== undefined && $popup.hasClass(className.animating) ); + }, + fluid: function() { + return ($popup !== undefined && $popup.hasClass(className.fluid)); + }, + visible: function() { + return ($popup !== undefined && $popup.hasClass(className.popupVisible)); + }, + dropdown: function() { + return $module.hasClass(className.dropdown); + }, + hidden: function() { + return !module.is.visible(); + }, + rtl: function () { + return $module.attr('dir') === 'rtl' || $module.css('direction') === 'rtl'; + } + }, + + reset: function() { + module.remove.visible(); + if(settings.preserve) { + if($.fn.transition !== undefined) { + $popup + .transition('remove transition') + ; + } + } + else { + module.removePopup(); + } + }, + + setting: function(name, value) { + if( $.isPlainObject(name) ) { + $.extend(true, settings, name); + } + else if(value !== undefined) { + settings[name] = value; + } + else { + return settings[name]; + } + }, + internal: function(name, value) { + if( $.isPlainObject(name) ) { + $.extend(true, module, name); + } + else if(value !== undefined) { + module[name] = value; + } + else { + return module[name]; + } + }, + debug: function() { + if(!settings.silent && settings.debug) { + if(settings.performance) { + module.performance.log(arguments); + } + else { + module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':'); + module.debug.apply(console, arguments); + } + } + }, + verbose: function() { + if(!settings.silent && settings.verbose && settings.debug) { + if(settings.performance) { + module.performance.log(arguments); + } + else { + module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':'); + module.verbose.apply(console, arguments); + } + } + }, + error: function() { + if(!settings.silent) { + module.error = Function.prototype.bind.call(console.error, console, settings.name + ':'); + module.error.apply(console, arguments); + } + }, + performance: { + log: function(message) { + var + currentTime, + executionTime, + previousTime + ; + if(settings.performance) { + currentTime = new Date().getTime(); + previousTime = time || currentTime; + executionTime = currentTime - previousTime; + time = currentTime; + performance.push({ + 'Name' : message[0], + 'Arguments' : [].slice.call(message, 1) || '', + 'Element' : element, + 'Execution Time' : executionTime + }); + } + clearTimeout(module.performance.timer); + module.performance.timer = setTimeout(module.performance.display, 500); + }, + display: function() { + var + title = settings.name + ':', + totalTime = 0 + ; + time = false; + clearTimeout(module.performance.timer); + $.each(performance, function(index, data) { + totalTime += data['Execution Time']; + }); + title += ' ' + totalTime + 'ms'; + if(moduleSelector) { + title += ' \'' + moduleSelector + '\''; + } + if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { + console.groupCollapsed(title); + if(console.table) { + console.table(performance); + } + else { + $.each(performance, function(index, data) { + console.log(data['Name'] + ': ' + data['Execution Time']+'ms'); + }); + } + console.groupEnd(); + } + performance = []; + } + }, + invoke: function(query, passedArguments, context) { + var + object = instance, + maxDepth, + found, + response + ; + passedArguments = passedArguments || queryArguments; + context = element || context; + if(typeof query == 'string' && object !== undefined) { + query = query.split(/[\. ]/); + maxDepth = query.length - 1; + $.each(query, function(depth, value) { + var camelCaseValue = (depth != maxDepth) + ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1) + : query + ; + if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) { + object = object[camelCaseValue]; + } + else if( object[camelCaseValue] !== undefined ) { + found = object[camelCaseValue]; + return false; + } + else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) { + object = object[value]; + } + else if( object[value] !== undefined ) { + found = object[value]; + return false; + } + else { + return false; + } + }); + } + if ( $.isFunction( found ) ) { + response = found.apply(context, passedArguments); + } + else if(found !== undefined) { + response = found; + } + if(Array.isArray(returnedValue)) { + returnedValue.push(response); + } + else if(returnedValue !== undefined) { + returnedValue = [returnedValue, response]; + } + else if(response !== undefined) { + returnedValue = response; + } + return found; + } + }; + + if(methodInvoked) { + if(instance === undefined) { + module.initialize(); + } + module.invoke(query); + } + else { + if(instance !== undefined) { + instance.invoke('destroy'); + } + module.initialize(); + } + }) + ; + + return (returnedValue !== undefined) + ? returnedValue + : this + ; +}; + +$.fn.popup.settings = { + + name : 'Popup', + + // module settings + silent : false, + debug : false, + verbose : false, + performance : true, + namespace : 'popup', + + // whether it should use dom mutation observers + observeChanges : true, + + // callback only when element added to dom + onCreate : function(){}, + + // callback before element removed from dom + onRemove : function(){}, + + // callback before show animation + onShow : function(){}, + + // callback after show animation + onVisible : function(){}, + + // callback before hide animation + onHide : function(){}, + + // callback when popup cannot be positioned in visible screen + onUnplaceable : function(){}, + + // callback after hide animation + onHidden : function(){}, + + // when to show popup + on : 'hover', + + // element to use to determine if popup is out of boundary + boundary : window, + + // whether to add touchstart events when using hover + addTouchEvents : true, + + // default position relative to element + position : 'top left', + + // if given position should be used regardless if popup fits + forcePosition : false, + + // name of variation to use + variation : '', + + // whether popup should be moved to context + movePopup : true, + + // element which popup should be relative to + target : false, + + // jq selector or element that should be used as popup + popup : false, + + // popup should remain inline next to activator + inline : false, + + // popup should be removed from page on hide + preserve : false, + + // popup should not close when being hovered on + hoverable : false, + + // explicitly set content + content : false, + + // explicitly set html + html : false, + + // explicitly set title + title : false, + + // whether automatically close on clickaway when on click + closable : true, + + // automatically hide on scroll + hideOnScroll : 'auto', + + // hide other popups on show + exclusive : false, + + // context to attach popups + context : 'body', + + // context for binding scroll events + scrollContext : window, + + // position to prefer when calculating new position + prefer : 'opposite', + + // specify position to appear even if it doesn't fit + lastResort : false, + + // number of pixels from edge of popup to pointing arrow center (used from centering) + arrowPixelsFromEdge: 20, + + // delay used to prevent accidental refiring of animations due to user error + delay : { + show : 50, + hide : 70 + }, + + // whether fluid variation should assign width explicitly + setFluidWidth : true, + + // transition settings + duration : 200, + transition : 'scale', + + // distance away from activating element in px + distanceAway : 0, + + // number of pixels an element is allowed to be "offstage" for a position to be chosen (allows for rounding) + jitter : 2, + + // offset on aligning axis from calculated position + offset : 0, + + // maximum times to look for a position before failing (9 positions total) + maxSearchDepth : 15, + + error: { + invalidPosition : 'The position you specified is not a valid position', + cannotPlace : 'Popup does not fit within the boundaries of the viewport', + method : 'The method you called is not defined.', + noTransition : 'This module requires ui transitions ', + notFound : 'The target or popup you specified does not exist on the page' + }, + + metadata: { + activator : 'activator', + content : 'content', + html : 'html', + offset : 'offset', + position : 'position', + title : 'title', + variation : 'variation' + }, + + className : { + active : 'active', + basic : 'basic', + animating : 'animating', + dropdown : 'dropdown', + fluid : 'fluid', + loading : 'loading', + popup : 'ui popup', + position : 'top left center bottom right', + visible : 'visible', + popupVisible : 'visible' + }, + + selector : { + popup : '.ui.popup' + }, + + templates: { + escape: function(string) { + var + badChars = /[<>"'`]/g, + shouldEscape = /[&<>"'`]/, + escape = { + "<": "<", + ">": ">", + '"': """, + "'": "'", + "`": "`" + }, + escapedChar = function(chr) { + return escape[chr]; + } + ; + if(shouldEscape.test(string)) { + string = string.replace(/&(?![a-z0-9#]{1,6};)/, "&"); + return string.replace(badChars, escapedChar); + } + return string; + }, + popup: function(text) { + var + html = '', + escape = $.fn.popup.settings.templates.escape + ; + if(typeof text !== undefined) { + if(typeof text.title !== undefined && text.title) { + text.title = escape(text.title); + html += '
' + text.title + '
'; + } + if(typeof text.content !== undefined && text.content) { + text.content = escape(text.content); + html += '
' + text.content + '
'; + } + } + return html; + } + } + +}; + + })( jQuery, window, document ); /*! @@ -9106,6286 +14493,6 @@ $.fn.sidebar.settings = { }; -})( jQuery, window, document ); - -/*! - * # Fomantic-UI 2.8.8 - Toast - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -;(function ($, window, document, undefined) { - -'use strict'; - -$.isFunction = $.isFunction || function(obj) { - return typeof obj === "function" && typeof obj.nodeType !== "number"; -}; - -window = (typeof window != 'undefined' && window.Math == Math) - ? window - : (typeof self != 'undefined' && self.Math == Math) - ? self - : Function('return this')() -; - -$.fn.toast = function(parameters) { - var - $allModules = $(this), - moduleSelector = $allModules.selector || '', - - time = new Date().getTime(), - performance = [], - - query = arguments[0], - methodInvoked = (typeof query == 'string'), - queryArguments = [].slice.call(arguments, 1), - returnedValue - ; - $allModules - .each(function() { - var - settings = ( $.isPlainObject(parameters) ) - ? $.extend(true, {}, $.fn.toast.settings, parameters) - : $.extend({}, $.fn.toast.settings), - - className = settings.className, - selector = settings.selector, - error = settings.error, - namespace = settings.namespace, - fields = settings.fields, - - eventNamespace = '.' + namespace, - moduleNamespace = namespace + '-module', - - $module = $(this), - $toastBox, - $toast, - $actions, - $progress, - $progressBar, - $animationObject, - $close, - $context = (settings.context) - ? $(settings.context) - : $('body'), - - isToastComponent = $module.hasClass('toast') || $module.hasClass('message') || $module.hasClass('card'), - - element = this, - instance = isToastComponent ? $module.data(moduleNamespace) : undefined, - - module - ; - module = { - - initialize: function() { - module.verbose('Initializing element'); - if (!module.has.container()) { - module.create.container(); - } - if(isToastComponent || settings.message !== '' || settings.title !== '' || module.get.iconClass() !== '' || settings.showImage || module.has.configActions()) { - if(typeof settings.showProgress !== 'string' || [className.top,className.bottom].indexOf(settings.showProgress) === -1 ) { - settings.showProgress = false; - } - module.create.toast(); - if(settings.closeOnClick && (settings.closeIcon || $($toast).find(selector.input).length > 0 || module.has.configActions())){ - settings.closeOnClick = false; - } - if(!settings.closeOnClick) { - $toastBox.addClass(className.unclickable); - } - module.bind.events(); - } - module.instantiate(); - if($toastBox) { - module.show(); - } - }, - - instantiate: function() { - module.verbose('Storing instance of toast'); - instance = module; - $module - .data(moduleNamespace, instance) - ; - }, - - destroy: function() { - if($toastBox) { - module.debug('Removing toast', $toastBox); - module.unbind.events(); - $toastBox.remove(); - $toastBox = undefined; - $toast = undefined; - $animationObject = undefined; - settings.onRemove.call($toastBox, element); - $progress = undefined; - $progressBar = undefined; - $close = undefined; - } - $module - .removeData(moduleNamespace) - ; - }, - - show: function(callback) { - callback = callback || function(){}; - module.debug('Showing toast'); - if(settings.onShow.call($toastBox, element) === false) { - module.debug('onShow callback returned false, cancelling toast animation'); - return; - } - module.animate.show(callback); - }, - - close: function(callback) { - callback = callback || function(){}; - module.remove.visible(); - module.unbind.events(); - module.animate.close(callback); - - }, - - create: { - container: function() { - module.verbose('Creating container'); - $context.append($('
',{class: settings.position + ' ' + className.container + ' ' +(settings.horizontal ? className.horizontal : '')})); - }, - toast: function() { - $toastBox = $('
', {class: className.box}); - var iconClass = module.get.iconClass(); - if (!isToastComponent) { - module.verbose('Creating toast'); - $toast = $('
'); - var $content = $('
', {class: className.content}); - if (iconClass !== '') { - $toast.append($('', {class: iconClass + ' ' + className.icon})); - } - - if (settings.showImage) { - $toast.append($('', { - class: className.image + ' ' + settings.classImage, - src: settings.showImage - })); - } - if (settings.title !== '') { - $content.append($('
', { - class: className.title, - text: settings.title - })); - } - - $content.append($('
', {class: className.message, html: module.helpers.escape(settings.message, settings.preserveHTML)})); - - $toast - .addClass(settings.class + ' ' + className.toast) - .append($content) - ; - $toast.css('opacity', settings.opacity); - if (settings.closeIcon) { - $close = $('', {class: className.close + ' ' + (typeof settings.closeIcon === 'string' ? settings.closeIcon : '')}); - if($close.hasClass(className.left)) { - $toast.prepend($close); - } else { - $toast.append($close); - } - } - } else { - $toast = settings.cloneModule ? $module.clone().removeAttr('id') : $module; - $close = $toast.find('> i'+module.helpers.toClass(className.close)); - settings.closeIcon = ($close.length > 0); - if (iconClass !== '') { - $toast.find(selector.icon).attr('class',iconClass + ' ' + className.icon); - } - if (settings.showImage) { - $toast.find(selector.image).attr('src',settings.showImage); - } - if (settings.title !== '') { - $toast.find(selector.title).html(module.helpers.escape(settings.title, settings.preserveHTML)); - } - if (settings.message !== '') { - $toast.find(selector.message).html(module.helpers.escape(settings.message, settings.preserveHTML)); - } - } - if ($toast.hasClass(className.compact)) { - settings.compact = true; - } - if ($toast.hasClass('card')) { - settings.compact = false; - } - $actions = $toast.find('.actions'); - if (module.has.configActions()) { - if ($actions.length === 0) { - $actions = $('
', {class: className.actions + ' ' + (settings.classActions || '')}).appendTo($toast); - } - if($toast.hasClass('card') && !$actions.hasClass(className.attached)) { - $actions.addClass(className.extraContent); - if($actions.hasClass(className.vertical)) { - $actions.removeClass(className.vertical); - module.error(error.verticalCard); - } - } - settings.actions.forEach(function (el) { - var icon = el[fields.icon] ? '' : '', - text = module.helpers.escape(el[fields.text] || '', settings.preserveHTML), - cls = module.helpers.deQuote(el[fields.class] || ''), - click = el[fields.click] && $.isFunction(el[fields.click]) ? el[fields.click] : function () {}; - $actions.append($('