From 6a17231b0bd9d8eb89b3f854d1d68bcc5ea01977 Mon Sep 17 00:00:00 2001 From: grandeljay Date: Tue, 5 Apr 2022 20:01:56 +0200 Subject: [PATCH 1/4] Add tabs --- semantic.json | 1 + semantic/dist/components/menu.css | 5 + semantic/dist/components/menu.min.css | 2 +- semantic/dist/components/tab.css | 88 ++ semantic/dist/components/tab.js | 1001 ++++++++++++++++ semantic/dist/components/tab.min.css | 9 + semantic/dist/components/tab.min.js | 11 + semantic/dist/semantic.css | 90 ++ semantic/dist/semantic.js | 1002 +++++++++++++++++ semantic/dist/semantic.min.css | 2 +- semantic/dist/semantic.min.js | 2 +- .../src/definitions/collections/menu.less | 5 + src/assets/js/profile.js | 2 + src/pages/profile.php | 344 +++++- 14 files changed, 2507 insertions(+), 57 deletions(-) create mode 100644 semantic/dist/components/tab.css create mode 100644 semantic/dist/components/tab.js create mode 100644 semantic/dist/components/tab.min.css create mode 100644 semantic/dist/components/tab.min.js diff --git a/semantic.json b/semantic.json index 9079872a..6ffc0ae9 100644 --- a/semantic.json +++ b/semantic.json @@ -51,6 +51,7 @@ "popup", "message", "list", + "tab", "api", "transition" diff --git a/semantic/dist/components/menu.css b/semantic/dist/components/menu.css index df3bed9f..486feaa1 100644 --- a/semantic/dist/components/menu.css +++ b/semantic/dist/components/menu.css @@ -1969,6 +1969,11 @@ Floated Menu / Item 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; diff --git a/semantic/dist/components/menu.min.css b/semantic/dist/components/menu.min.css index 25205a3e..a9a09074 100644 --- a/semantic/dist/components/menu.min.css +++ b/semantic/dist/components/menu.min.css @@ -1 +1 @@ -.ui.menu{display:-webkit-box;display:-ms-flexbox;display:flex;margin:1rem 0;font-family:Raleway,sans-serif;background:#fff;font-weight:400;border:1px solid rgba(34,36,38,.15);-webkit-box-shadow:0 1px 2px 0 rgba(34,36,38,.15);box-shadow:0 1px 2px 0 rgba(34,36,38,.15);border-radius:.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}.ui.menu .menu{margin:0}.ui.menu:not(.vertical)>.menu{display:-webkit-box;display:-ms-flexbox;display:flex}.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:0 0;padding:.91666667em 1.16666667em;text-transform:none;color:rgba(0,0,0,.87);font-weight:400;-webkit-transition:background .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background .1s ease,box-shadow .1s ease,color .1s ease;transition:background .1s ease,box-shadow .1s ease,color .1s ease,-webkit-box-shadow .1s ease}.ui.menu>.item:first-child{border-radius:.33333333rem 0 0 .33333333rem}.ui.menu .item:before{position:absolute;content:'';top:0;right:0;height:100%;width:1px;background:rgba(34,36,38,.1)}.ui.menu .item>a:not(.ui),.ui.menu .item>p:only-child,.ui.menu .text.item>*{-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}.ui.menu .item>i.icon{opacity:.9;float:none;margin:0 .41666667em 0 0}.ui.menu:not(.vertical) .item>.button{position:relative;top:0;margin:-.5em 0;padding-bottom:.75em;padding-top:.75em;font-size:1em}.ui.menu>.container,.ui.menu>.grid{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}.ui.menu .item>.input{width:100%}.ui.menu:not(.vertical) .item>.input{position:relative;top:0;margin:-.5em 0}.ui.menu .item>.input input{font-size:1em;padding-top:.66666667em;padding-bottom:.66666667em}.ui.menu .header.item,.ui.vertical.menu .header.item{margin:0;background:'';text-transform:normal;font-weight:700}.ui.vertical.menu .item>.header:not(.ui){margin:0 0 .5em;font-size:1em;font-weight:700}.ui.menu .item>i.dropdown.icon{padding:0;float:right;margin:0 0 0 1em}.ui.menu .dropdown.item .menu{min-width:calc(100% - 1px);border-radius:0 0 .33333333rem .33333333rem;background:#fff;margin:0 0 0;-webkit-box-shadow:0 1px 3px 0 rgba(0,0,0,.08);box-shadow:0 1px 3px 0 rgba(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}.ui.menu .ui.dropdown .menu>.item{margin:0;text-align:left;font-size:1em!important;padding:.75em 1.16666667em!important;background:0 0!important;color:rgba(0,0,0,.87)!important;text-transform:none!important;font-weight:400!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,.05)!important;color:rgba(0,0,0,.95)!important}.ui.menu .ui.dropdown .menu>.selected.item{background:rgba(0,0,0,.05)!important;color:rgba(0,0,0,.95)!important}.ui.menu .ui.dropdown .menu>.active.item{background:rgba(0,0,0,.03)!important;font-weight:700!important;color:rgba(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 .75em 0 0!important}.ui.secondary.menu .dropdown.item>.menu,.ui.text.menu .dropdown.item>.menu{border-radius:.33333333rem;margin-top:.41666667em}.ui.menu .pointing.dropdown.item .menu{margin-top:.75em}.ui.inverted.menu .search.dropdown.item>.search,.ui.inverted.menu .search.dropdown.item>.text{color:rgba(255,255,255,.9)}.ui.vertical.menu .dropdown.item>i.icon{float:right;content:"\f0da";margin-left:1em}.ui.vertical.menu .dropdown.item .menu{left:100%;min-width:0;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;margin:0;-webkit-box-shadow:0 1px 3px 0 rgba(0,0,0,.08);box-shadow:0 1px 3px 0 rgba(0,0,0,.08);border-radius:0 .33333333rem .33333333rem .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}.ui.item.menu .dropdown .menu .item{width:100%}.ui.menu .item>.label:not(.floating){margin-left:1em;padding:.3em .75em}.ui.vertical.menu .item>.label{margin-top:-.15em;margin-bottom:-.15em;padding:.3em .75em}.ui.menu .item>.floating.label{padding:.3em .75em}.ui.menu .item>.label{background:#999;color:#fff}.ui.menu .item>.image.label img{margin:-.2833em .8em -.2833em -.8em;height:1.5666em}.ui.menu .item>img:not(.ui){display:inline-block;vertical-align:middle;margin:-.3em 0;width:2.5em}.ui.vertical.menu .item>img:not(.ui):only-child{display:block;max-width:100%;width:auto}.ui.menu .list .item:before{background:0 0!important}.ui.vertical.sidebar.menu>.item:first-child:before{display:block!important}.ui.vertical.sidebar.menu>.item::before{top:auto;bottom:0}@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,.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,.1)}}.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,.03);color:rgba(0,0,0,.95)}.ui.link.menu .item:active,.ui.menu .link.item:active,.ui.menu a.item:active{background:rgba(0,0,0,.03);color:rgba(0,0,0,.95)}.ui.menu .active.item{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);font-weight:400;-webkit-box-shadow:none;box-shadow:none}.ui.menu .active.item>i.icon{opacity:1}.ui.menu .active.item:hover,.ui.vertical.menu .active.item:hover{background-color:rgba(0,0,0,.05);color:rgba(0,0,0,.95)}.ui.ui.menu .item.disabled{cursor:default;background-color:transparent;color:rgba(40,40,40,.3);pointer-events:none}.ui.menu:not(.vertical) .left.item,.ui.menu:not(.vertical) .left.menu{display:-webkit-box;display:-ms-flexbox;display:flex;margin-right:auto!important}.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}.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}.ui.menu .right.item::before,.ui.menu .right.menu>.item::before{right:auto;left:0}.ui.menu .center.item:last-child::before,.ui.menu .center.menu>.item:last-child::before{display:none}.ui.vertical.menu{display:block;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background:#fff;-webkit-box-shadow:0 1px 2px 0 rgba(34,36,38,.15);box-shadow:0 1px 2px 0 rgba(34,36,38,.15)}.ui.vertical.menu .item{display:block;background:0 0;border-top:none;border-right:none}.ui.vertical.menu>.item:first-child{border-radius:.33333333rem .33333333rem 0 0}.ui.vertical.menu>.item:last-child{border-radius:0 0 .33333333rem .33333333rem}.ui.vertical.menu .item>.label{float:right;text-align:center}.ui.vertical.menu .item>i.icon,.ui.vertical.menu .item>i.icons{width:1.18em;float:right;margin:0 0 0 .5em}.ui.vertical.menu .item>.label+i.icon{float:none;margin:0 .5em 0 0}.ui.vertical.menu .item:before{position:absolute;content:'';top:0;left:0;width:100%;height:1px;background:rgba(34,36,38,.1)}.ui.vertical.menu .item:first-child:before{display:none!important}.ui.vertical.menu .item>.menu{margin:.5em -1.16666667em 0}.ui.vertical.menu .menu .item{background:0 0;padding:.5em 1.36111111em;font-size:.83333333em;color:rgba(0,0,0,.5)}.ui.vertical.menu .item .menu .link.item:hover,.ui.vertical.menu .item .menu a.item:hover{color:rgba(0,0,0,.85)}.ui.vertical.menu .menu .item:before{display:none}.ui.vertical.menu .active.item{background:rgba(0,0,0,.05);border-radius:0;-webkit-box-shadow:none;box-shadow:none}.ui.vertical.menu>.active.item:first-child{border-radius:.33333333rem .33333333rem 0 0}.ui.vertical.menu>.active.item:last-child{border-radius:0 0 .33333333rem .33333333rem}.ui.vertical.menu>.active.item:only-child{border-radius:.33333333rem}.ui.vertical.menu .active.item .menu .active.item{border-left:none}.ui.vertical.menu .item .menu .active.item{background-color:transparent;font-weight:700;color:rgba(0,0,0,.95)}.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:0 0;border-bottom:none;border-left:1px solid transparent;border-right:1px solid transparent;border-top:2px solid transparent;padding:.91666667em 1.41666667em;color:rgba(0,0,0,.87)}.ui.tabular.menu .item:before{display:none}.ui.tabular.menu .item:hover{background-color:transparent;color:rgba(0,0,0,.8)}.ui.tabular.menu .active.item{background:none #fff;color:rgba(0,0,0,.95);border-top-width:1px;border-color:#d4d4d5;font-weight:700;margin-bottom:-1px;-webkit-box-shadow:none;box-shadow:none;border-radius:.33333333rem .33333333rem 0 0!important}.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}.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:0 0;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 #fff;color:rgba(0,0,0,.95);border-color:#d4d4d5;margin:-1px 0 0 0;border-radius:0 0 .33333333rem .33333333rem!important}.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:0 0;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 #fff;color:rgba(0,0,0,.95);border-color:#d4d4d5;margin:0 -1px 0 0;border-radius:.33333333rem 0 0 .33333333rem!important}.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:0 0;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 #fff;color:rgba(0,0,0,.95);border-color:#d4d4d5;margin:0 0 0 -1px;border-radius:0 .33333333rem .33333333rem 0!important}.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}.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 .33333333rem .33333333rem 0}.ui.compact.menu .item:last-child{border-radius:0 .33333333rem .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}.ui.pagination.menu .active.item{border-top:none;padding-top:.91666667em;background-color:rgba(0,0,0,.05);color:rgba(0,0,0,.95);-webkit-box-shadow:none;box-shadow:none}.ui.secondary.menu{background:0 0;margin-left:-.41666667em;margin-right:-.41666667em;border-radius:0;border:none;-webkit-box-shadow:none;box-shadow:none}.ui.secondary.menu .item{-ms-flex-item-align:center;align-self:center;-webkit-box-shadow:none;box-shadow:none;border:none;padding:.75em .91666667em;margin:0 .41666667em;background:0 0;-webkit-transition:color .1s ease;transition:color .1s ease;border-radius:.33333333rem}.ui.secondary.menu .item:before{display:none!important}.ui.secondary.menu .header.item{border-radius:0;border-right:none;background:none transparent}.ui.secondary.menu .item>img:not(.ui){margin:0}.ui.secondary.menu .dropdown.item:hover,.ui.secondary.menu .link.item:hover,.ui.secondary.menu a.item:hover{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95)}.ui.secondary.menu .active.item{-webkit-box-shadow:none;box-shadow:none;background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);border-radius:.33333333rem}.ui.secondary.menu .active.item:hover{-webkit-box-shadow:none;box-shadow:none;background:rgba(0,0,0,.05);color:rgba(0,0,0,.95)}.ui.secondary.inverted.menu .link.item:not(.disabled),.ui.secondary.inverted.menu a.item:not(.disabled){color:rgba(255,255,255,.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,.08);color:#fff}.ui.secondary.inverted.menu .active.item{background:rgba(255,255,255,.15);color:#fff}.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}.ui.vertical.secondary.menu .item:not(.dropdown)>.menu{margin:0 -.91666667em}.ui.vertical.secondary.menu .item:not(.dropdown)>.menu>.item{margin:0;padding:.58333333em 1.36111111em}.ui.secondary.vertical.menu>.item{border:none;margin:0 0 .41666667em;border-radius:.33333333rem!important}.ui.secondary.vertical.menu>.header.item{border-radius:0}.ui.vertical.secondary.menu .item>.menu .item{background-color:transparent}.ui.secondary.inverted.menu{background-color:transparent}.ui.secondary.pointing.menu{margin-left:0;margin-right:0;border-bottom:2px solid rgba(34,36,38,.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:.83333333em 1.16666667em;border-bottom-width:2px;-webkit-transition:color .1s ease;transition:color .1s ease}.ui.secondary.pointing.menu .ui.dropdown .menu .item{border-bottom-width:0}.ui.secondary.pointing.menu .item>.label:not(.floating){margin-top:-.3em;margin-bottom:-.3em}.ui.secondary.pointing.menu .item>.circular.label{margin-top:-.5em;margin-bottom:-.5em}.ui.secondary.pointing.menu .header.item{color:rgba(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}.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,.87)}.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,.15)}.ui.secondary.pointing.menu .active.item{background-color:transparent;-webkit-box-shadow:none;box-shadow:none;border-color:currentColor;font-weight:700;color:rgba(0,0,0,.95)}.ui.secondary.pointing.menu .active.item:hover{border-color:currentColor;color:rgba(0,0,0,.95)}.ui.secondary.pointing.menu .active.dropdown.item{border-color:transparent}.ui.secondary.vertical.pointing.menu{border-bottom-width:0;border-right-width:2px;border-right-style:solid;border-right-color:rgba(34,36,38,.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}.ui.secondary.vertical.pointing.menu .active.item{border-color:currentColor}.ui.secondary.inverted.pointing.menu{border-color:rgba(255,255,255,.1)}.ui.secondary.inverted.pointing.menu .item:not(.disabled){color:rgba(255,255,255,.9)}.ui.secondary.inverted.pointing.menu .header.item{color:#fff!important}.ui.secondary.inverted.pointing.menu .link.item:hover,.ui.secondary.inverted.pointing.menu a.item:hover{color:#fff}.ui.ui.secondary.inverted.pointing.menu .active.item{border-color:#fff;color:#fff;background-color:transparent}.ui.text.menu{background:none transparent;border-radius:0;-webkit-box-shadow:none;box-shadow:none;border:none;margin:1em -.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:.41666667em .58333333em;font-weight:400;color:rgba(0,0,0,.6);-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.ui.text.menu .item:before,.ui.text.menu .menu .item:before{display:none!important}.ui.text.menu .header.item{background-color:transparent;opacity:1;color:rgba(0,0,0,.85);font-size:.91666667em;text-transform:uppercase;font-weight:700}.ui.text.menu .item>img:not(.ui){margin:0}.ui.text.item.menu .item{margin:0}.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:.66666667em 0;padding-left:0;padding-right:0}.ui.vertical.text.menu .item>i.icon{float:none;margin:0 .41666667em 0 0}.ui.vertical.text.menu .header.item{margin:.66666667em 0 .83333333em}.ui.vertical.text.menu .item:not(.dropdown)>.menu{margin:0}.ui.vertical.text.menu .item:not(.dropdown)>.menu>.item{margin:0;padding:.58333333em 0}.ui.text.menu .item:hover{opacity:1;background-color:transparent}.ui.text.menu .active.item{background-color:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;font-weight:400;color:rgba(0,0,0,.95)}.ui.text.menu .active.item:hover{background-color:transparent}.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}.ui.inverted.text.menu,.ui.inverted.text.menu .active.item,.ui.inverted.text.menu .item,.ui.inverted.text.menu .item:hover{background-color:transparent}.ui.fluid.text.menu{margin-left:0;margin-right:0}.ui.vertical.icon.menu{display:inline-block;width:auto}.ui.icon.menu .item{height:auto;text-align:center;color:#1b1c1d}.ui.icon.menu .item>i.icon:not(.dropdown){margin:0;opacity:1}.ui.icon.menu i.icon:before{opacity:1}.ui.menu .icon.item>i.icon{width:auto;margin:0 auto}.ui.vertical.icon.menu .item>i.icon:not(.dropdown){display:block;opacity:1;margin:0 auto;float:none}.ui.inverted.icon.menu .item{color:#fff}.ui.labeled.icon.menu{text-align:center}.ui.labeled.icon.menu .item{min-width:6em;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ui.labeled.icon.menu>.item>i.icon:not(.dropdown){height:1em;display:block;font-size:1.75em!important;margin:0 auto .5rem!important}.ui.fluid.labeled.icon.menu>.item{min-width:0}@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,.1)}.ui.stackable.menu .left.item,.ui.stackable.menu .left.menu{margin-right:0!important}.ui.stackable.menu .right.item,.ui.stackable.menu .right.menu{margin-left:0!important}.ui.stackable.menu .center.item,.ui.stackable.menu .center.menu{margin-left:0!important;margin-right:0!important}.ui.stackable.menu .center.menu,.ui.stackable.menu .left.menu,.ui.stackable.menu .right.menu{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.ui.ui.primary.menu .active.item,.ui.ui.primary.menu .active.item:hover,.ui.ui.ui.menu .primary.active.item{color:#6435c9}.ui.ui.red.menu .active.item,.ui.ui.red.menu .active.item:hover,.ui.ui.ui.menu .red.active.item{color:#db2828}.ui.ui.orange.menu .active.item,.ui.ui.orange.menu .active.item:hover,.ui.ui.ui.menu .orange.active.item{color:#f2711c}.ui.ui.ui.menu .yellow.active.item,.ui.ui.yellow.menu .active.item,.ui.ui.yellow.menu .active.item:hover{color:#fbbd08}.ui.ui.olive.menu .active.item,.ui.ui.olive.menu .active.item:hover,.ui.ui.ui.menu .olive.active.item{color:#b5cc18}.ui.ui.green.menu .active.item,.ui.ui.green.menu .active.item:hover,.ui.ui.ui.menu .green.active.item{color:#21ba45}.ui.ui.teal.menu .active.item,.ui.ui.teal.menu .active.item:hover,.ui.ui.ui.menu .teal.active.item{color:#00b5ad}.ui.ui.blue.menu .active.item,.ui.ui.blue.menu .active.item:hover,.ui.ui.ui.menu .blue.active.item{color:#2185d0}.ui.ui.ui.menu .violet.active.item,.ui.ui.violet.menu .active.item,.ui.ui.violet.menu .active.item:hover{color:#6435c9}.ui.ui.purple.menu .active.item,.ui.ui.purple.menu .active.item:hover,.ui.ui.ui.menu .purple.active.item{color:#a333c8}.ui.ui.pink.menu .active.item,.ui.ui.pink.menu .active.item:hover,.ui.ui.ui.menu .pink.active.item{color:#e03997}.ui.ui.brown.menu .active.item,.ui.ui.brown.menu .active.item:hover,.ui.ui.ui.menu .brown.active.item{color:#a5673f}.ui.ui.grey.menu .active.item,.ui.ui.grey.menu .active.item:hover,.ui.ui.ui.menu .grey.active.item{color:#767676}.ui.ui.black.menu .active.item,.ui.ui.black.menu .active.item:hover,.ui.ui.ui.menu .black.active.item{color:#1b1c1d}.ui.inverted.menu{border:0 solid transparent;background:#1b1c1d;-webkit-box-shadow:none;box-shadow:none}.ui.inverted.menu .item,.ui.inverted.menu .item>a:not(.ui){background:0 0;color:rgba(255,255,255,.9)}.ui.inverted.menu .item.menu{background:0 0}.ui.inverted.menu .item:before{background:rgba(255,255,255,.08)}.ui.vertical.inverted.menu .item:before{background:rgba(255,255,255,.08)}.ui.vertical.inverted.menu .menu .item,.ui.vertical.inverted.menu .menu .item a:not(.ui){color:rgba(255,255,255,.5)}.ui.inverted.menu .header.item{margin:0;background:0 0;-webkit-box-shadow:none;box-shadow:none}.ui.ui.inverted.menu .item.disabled{color:rgba(225,225,225,.3)}.ui.inverted.menu .dropdown.item:hover,.ui.inverted.menu .link.item:hover,.ui.inverted.menu a.item:hover,.ui.link.inverted.menu .item:hover{background:rgba(255,255,255,.08);color:#fff}.ui.vertical.inverted.menu .item .menu .link.item:hover,.ui.vertical.inverted.menu .item .menu a.item:hover{background:0 0;color:#fff}.ui.inverted.menu .link.item:active,.ui.inverted.menu a.item:active{background:rgba(255,255,255,.08);color:#fff}.ui.inverted.menu .active.item{background:#3d3e3f;color:#fff!important}.ui.inverted.vertical.menu .item .menu .active.item{background:0 0;color:#fff}.ui.inverted.pointing.menu .active.item:after{background:#3d3e3f;margin:0!important;-webkit-box-shadow:none!important;box-shadow:none!important;border:none!important}.ui.inverted.menu .active.item:hover{background:#3d3e3f;color:#fff!important}.ui.inverted.pointing.menu .active.item:hover:after{background:#3d3e3f}.ui.floated.menu{float:left;margin:0 .5rem 0 0}.ui.floated.menu .item:last-child:before{display:none}.ui.right.floated.menu{float:right;margin:0 0 0 .5rem}.ui.ui.inverted.primary.menu,.ui.ui.ui.inverted.menu .primary.active.item{background-color:#6435c9}.ui.inverted.primary.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.primary.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.primary.menu .active.item{background-color:#5829bb}.ui.ui.inverted.red.menu,.ui.ui.ui.inverted.menu .red.active.item{background-color:#db2828}.ui.inverted.red.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.red.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.red.menu .active.item{background-color:#d01919}.ui.ui.inverted.orange.menu,.ui.ui.ui.inverted.menu .orange.active.item{background-color:#f2711c}.ui.inverted.orange.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.orange.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.orange.menu .active.item{background-color:#f26202}.ui.ui.inverted.yellow.menu,.ui.ui.ui.inverted.menu .yellow.active.item{background-color:#fbbd08}.ui.inverted.yellow.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.yellow.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.yellow.menu .active.item{background-color:#eaae00}.ui.ui.inverted.olive.menu,.ui.ui.ui.inverted.menu .olive.active.item{background-color:#b5cc18}.ui.inverted.olive.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.olive.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.olive.menu .active.item{background-color:#a7bd0d}.ui.ui.inverted.green.menu,.ui.ui.ui.inverted.menu .green.active.item{background-color:#21ba45}.ui.inverted.green.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.green.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.green.menu .active.item{background-color:#16ab39}.ui.ui.inverted.teal.menu,.ui.ui.ui.inverted.menu .teal.active.item{background-color:#00b5ad}.ui.inverted.teal.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.teal.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.teal.menu .active.item{background-color:#009c95}.ui.ui.inverted.blue.menu,.ui.ui.ui.inverted.menu .blue.active.item{background-color:#2185d0}.ui.inverted.blue.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.blue.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.blue.menu .active.item{background-color:#1678c2}.ui.ui.inverted.violet.menu,.ui.ui.ui.inverted.menu .violet.active.item{background-color:#6435c9}.ui.inverted.violet.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.violet.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.violet.menu .active.item{background-color:#5829bb}.ui.ui.inverted.purple.menu,.ui.ui.ui.inverted.menu .purple.active.item{background-color:#a333c8}.ui.inverted.purple.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.purple.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.purple.menu .active.item{background-color:#9627ba}.ui.ui.inverted.pink.menu,.ui.ui.ui.inverted.menu .pink.active.item{background-color:#e03997}.ui.inverted.pink.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.pink.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.pink.menu .active.item{background-color:#e61a8d}.ui.ui.inverted.brown.menu,.ui.ui.ui.inverted.menu .brown.active.item{background-color:#a5673f}.ui.inverted.brown.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.brown.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.brown.menu .active.item{background-color:#975b33}.ui.ui.inverted.grey.menu,.ui.ui.ui.inverted.menu .grey.active.item{background-color:#767676}.ui.inverted.grey.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.grey.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.grey.menu .active.item{background-color:#838383}.ui.ui.inverted.black.menu,.ui.ui.ui.inverted.menu .black.active.item{background-color:#1b1c1d}.ui.inverted.black.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.black.menu .active.item{background-color:rgba(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}.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:.91666667em;padding-bottom:.91666667em}.ui.menu .vertically.fitted.item,.ui.vertically.fitted.menu .item,.ui.vertically.fitted.menu .item .menu .item{padding-left:1.16666667em;padding-right:1.16666667em}.ui.borderless.menu .item .menu .item:before,.ui.borderless.menu .item:before,.ui.menu .borderless.item:before{background:0 0!important}.ui.compact.menu{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin:0;vertical-align:middle}.ui.compact.vertical.menu{display:-ms-inline-flexbox!important;display:inline-block}.ui.compact.menu:not(.secondary) .item:last-child{border-radius:0 .33333333rem .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}.ui.menu.fluid,.ui.vertical.menu.fluid{width:100%!important}.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%}.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%}.ui.fixed.menu+.ui.grid{padding-top:2.75rem}.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:0 0;margin:.5px 0 0;width:.66666667em;height:.66666667em;border:none;border-bottom:1px solid #d4d4d5;border-right:1px solid #d4d4d5;z-index:2;-webkit-transition:background .1s ease;transition:background .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 -.5px 0 0;border:none;border-top:1px solid #d4d4d5;border-right:1px solid #d4d4d5}.ui.pointing.menu .ui.dropdown .menu .item:after,.ui.vertical.pointing.menu .ui.dropdown .menu .item:after{display:none}.ui.pointing.menu .active.item:after{visibility:visible}.ui.pointing.menu .active.dropdown.item:after{visibility:hidden}.ui.pointing.menu .active.item .menu .active.item:after,.ui.pointing.menu .dropdown.active.item:after{display:none}.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:#fff}.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}.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}.ui[class*="top attached"].menu{bottom:0;margin-bottom:0;top:0;margin-top:1rem;border-radius:.33333333rem .33333333rem 0 0}.ui.menu[class*="top attached"]:first-child{margin-top:0}.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,.15),none;box-shadow:0 1px 2px 0 rgba(34,36,38,.15),none;border-radius:0 0 .33333333rem .33333333rem}.ui[class*="bottom attached"].menu:last-child{margin-bottom:0}.ui.top.attached.menu>.item:first-child{border-radius:.33333333rem 0 0 0}.ui.bottom.attached.menu>.item:first-child{border-radius:0 0 0 .33333333rem}.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%}.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:.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}.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,.8)!important}.ui.menu .ui.inverted.dropdown .menu>.active.item{background:0 0!important;color:rgba(255,255,255,.8)!important}.ui.menu .ui.inverted.dropdown .menu>.item:hover{background:rgba(255,255,255,.08)!important;color:rgba(255,255,255,.8)!important}.ui.menu .ui.inverted.dropdown .menu>.selected.item{background:rgba(255,255,255,.15)!important;color:rgba(255,255,255,.8)!important}.ui.vertical.menu .inverted.dropdown.item .menu{-webkit-box-shadow:none;box-shadow:none} \ No newline at end of file +.ui.menu{display:-webkit-box;display:-ms-flexbox;display:flex;margin:1rem 0;font-family:Raleway,sans-serif;background:#fff;font-weight:400;border:1px solid rgba(34,36,38,.15);-webkit-box-shadow:0 1px 2px 0 rgba(34,36,38,.15);box-shadow:0 1px 2px 0 rgba(34,36,38,.15);border-radius:.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}.ui.menu .menu{margin:0}.ui.menu:not(.vertical)>.menu{display:-webkit-box;display:-ms-flexbox;display:flex}.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:0 0;padding:.91666667em 1.16666667em;text-transform:none;color:rgba(0,0,0,.87);font-weight:400;-webkit-transition:background .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background .1s ease,color .1s ease,-webkit-box-shadow .1s ease;transition:background .1s ease,box-shadow .1s ease,color .1s ease;transition:background .1s ease,box-shadow .1s ease,color .1s ease,-webkit-box-shadow .1s ease}.ui.menu>.item:first-child{border-radius:.33333333rem 0 0 .33333333rem}.ui.menu .item:before{position:absolute;content:'';top:0;right:0;height:100%;width:1px;background:rgba(34,36,38,.1)}.ui.menu .item>a:not(.ui),.ui.menu .item>p:only-child,.ui.menu .text.item>*{-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}.ui.menu .item>i.icon{opacity:.9;float:none;margin:0 .41666667em 0 0}.ui.menu:not(.vertical) .item>.button{position:relative;top:0;margin:-.5em 0;padding-bottom:.75em;padding-top:.75em;font-size:1em}.ui.menu>.container,.ui.menu>.grid{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}.ui.menu .item>.input{width:100%}.ui.menu:not(.vertical) .item>.input{position:relative;top:0;margin:-.5em 0}.ui.menu .item>.input input{font-size:1em;padding-top:.66666667em;padding-bottom:.66666667em}.ui.menu .header.item,.ui.vertical.menu .header.item{margin:0;background:'';text-transform:normal;font-weight:700}.ui.vertical.menu .item>.header:not(.ui){margin:0 0 .5em;font-size:1em;font-weight:700}.ui.menu .item>i.dropdown.icon{padding:0;float:right;margin:0 0 0 1em}.ui.menu .dropdown.item .menu{min-width:calc(100% - 1px);border-radius:0 0 .33333333rem .33333333rem;background:#fff;margin:0 0 0;-webkit-box-shadow:0 1px 3px 0 rgba(0,0,0,.08);box-shadow:0 1px 3px 0 rgba(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}.ui.menu .ui.dropdown .menu>.item{margin:0;text-align:left;font-size:1em!important;padding:.75em 1.16666667em!important;background:0 0!important;color:rgba(0,0,0,.87)!important;text-transform:none!important;font-weight:400!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,.05)!important;color:rgba(0,0,0,.95)!important}.ui.menu .ui.dropdown .menu>.selected.item{background:rgba(0,0,0,.05)!important;color:rgba(0,0,0,.95)!important}.ui.menu .ui.dropdown .menu>.active.item{background:rgba(0,0,0,.03)!important;font-weight:700!important;color:rgba(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 .75em 0 0!important}.ui.secondary.menu .dropdown.item>.menu,.ui.text.menu .dropdown.item>.menu{border-radius:.33333333rem;margin-top:.41666667em}.ui.menu .pointing.dropdown.item .menu{margin-top:.75em}.ui.inverted.menu .search.dropdown.item>.search,.ui.inverted.menu .search.dropdown.item>.text{color:rgba(255,255,255,.9)}.ui.vertical.menu .dropdown.item>i.icon{float:right;content:"\f0da";margin-left:1em}.ui.vertical.menu .dropdown.item .menu{left:100%;min-width:0;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;margin:0;-webkit-box-shadow:0 1px 3px 0 rgba(0,0,0,.08);box-shadow:0 1px 3px 0 rgba(0,0,0,.08);border-radius:0 .33333333rem .33333333rem .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}.ui.item.menu .dropdown .menu .item{width:100%}.ui.menu .item>.label:not(.floating){margin-left:1em;padding:.3em .75em}.ui.vertical.menu .item>.label{margin-top:-.15em;margin-bottom:-.15em;padding:.3em .75em}.ui.menu .item>.floating.label{padding:.3em .75em}.ui.menu .item>.label{background:#999;color:#fff}.ui.menu .item>.image.label img{margin:-.2833em .8em -.2833em -.8em;height:1.5666em}.ui.menu .item>img:not(.ui){display:inline-block;vertical-align:middle;margin:-.3em 0;width:2.5em}.ui.vertical.menu .item>img:not(.ui):only-child{display:block;max-width:100%;width:auto}.ui.menu .list .item:before{background:0 0!important}.ui.vertical.sidebar.menu>.item:first-child:before{display:block!important}.ui.vertical.sidebar.menu>.item::before{top:auto;bottom:0}@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,.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,.1)}}.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,.03);color:rgba(0,0,0,.95)}.ui.link.menu .item:active,.ui.menu .link.item:active,.ui.menu a.item:active{background:rgba(0,0,0,.03);color:rgba(0,0,0,.95)}.ui.menu .active.item{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);font-weight:400;-webkit-box-shadow:none;box-shadow:none}.ui.menu .active.item>i.icon{opacity:1}.ui.menu .active.item:hover,.ui.vertical.menu .active.item:hover{background-color:rgba(0,0,0,.05);color:rgba(0,0,0,.95)}.ui.ui.menu .item.disabled{cursor:default;background-color:transparent;color:rgba(40,40,40,.3);pointer-events:none}.ui.menu:not(.vertical) .left.item,.ui.menu:not(.vertical) .left.menu{display:-webkit-box;display:-ms-flexbox;display:flex;margin-right:auto!important}.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}.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}.ui.menu .right.item::before,.ui.menu .right.menu>.item::before{right:auto;left:0}.ui.menu .center.item:last-child::before,.ui.menu .center.menu>.item:last-child::before{display:none}.ui.vertical.menu{display:block;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background:#fff;-webkit-box-shadow:0 1px 2px 0 rgba(34,36,38,.15);box-shadow:0 1px 2px 0 rgba(34,36,38,.15)}.ui.vertical.menu .item{display:block;background:0 0;border-top:none;border-right:none}.ui.vertical.menu>.item:first-child{border-radius:.33333333rem .33333333rem 0 0}.ui.vertical.menu>.item:last-child{border-radius:0 0 .33333333rem .33333333rem}.ui.vertical.menu .item>.label{float:right;text-align:center}.ui.vertical.menu .item>i.icon,.ui.vertical.menu .item>i.icons{width:1.18em;float:right;margin:0 0 0 .5em}.ui.vertical.menu .item>.label+i.icon{float:none;margin:0 .5em 0 0}.ui.vertical.menu .item:before{position:absolute;content:'';top:0;left:0;width:100%;height:1px;background:rgba(34,36,38,.1)}.ui.vertical.menu .item:first-child:before{display:none!important}.ui.vertical.menu .item>.menu{margin:.5em -1.16666667em 0}.ui.vertical.menu .menu .item{background:0 0;padding:.5em 1.36111111em;font-size:.83333333em;color:rgba(0,0,0,.5)}.ui.vertical.menu .item .menu .link.item:hover,.ui.vertical.menu .item .menu a.item:hover{color:rgba(0,0,0,.85)}.ui.vertical.menu .menu .item:before{display:none}.ui.vertical.menu .active.item{background:rgba(0,0,0,.05);border-radius:0;-webkit-box-shadow:none;box-shadow:none}.ui.vertical.menu>.active.item:first-child{border-radius:.33333333rem .33333333rem 0 0}.ui.vertical.menu>.active.item:last-child{border-radius:0 0 .33333333rem .33333333rem}.ui.vertical.menu>.active.item:only-child{border-radius:.33333333rem}.ui.vertical.menu .active.item .menu .active.item{border-left:none}.ui.vertical.menu .item .menu .active.item{background-color:transparent;font-weight:700;color:rgba(0,0,0,.95)}.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:0 0;border-bottom:none;border-left:1px solid transparent;border-right:1px solid transparent;border-top:2px solid transparent;padding:.91666667em 1.41666667em;color:rgba(0,0,0,.87)}.ui.tabular.menu .item:before{display:none}.ui.tabular.menu .item:hover{background-color:transparent;color:rgba(0,0,0,.8)}.ui.tabular.menu .active.item{background:none #fff;color:rgba(0,0,0,.95);border-top-width:1px;border-color:#d4d4d5;font-weight:700;margin-bottom:-1px;-webkit-box-shadow:none;box-shadow:none;border-radius:.33333333rem .33333333rem 0 0!important}.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}.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:0 0;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 #fff;color:rgba(0,0,0,.95);border-color:#d4d4d5;margin:-1px 0 0 0;border-radius:0 0 .33333333rem .33333333rem!important}.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:0 0;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 #fff;color:rgba(0,0,0,.95);border-color:#d4d4d5;margin:0 -1px 0 0;border-radius:.33333333rem 0 0 .33333333rem!important}.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:0 0;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 #fff;color:rgba(0,0,0,.95);border-color:#d4d4d5;margin:0 0 0 -1px;border-radius:0 .33333333rem .33333333rem 0!important}.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}.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 .33333333rem .33333333rem 0}.ui.compact.menu .item:last-child{border-radius:0 .33333333rem .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}.ui.pagination.menu .active.item{border-top:none;padding-top:.91666667em;background-color:rgba(0,0,0,.05);color:rgba(0,0,0,.95);-webkit-box-shadow:none;box-shadow:none}.ui.secondary.menu{background:0 0;margin-left:-.41666667em;margin-right:-.41666667em;border-radius:0;border:none;-webkit-box-shadow:none;box-shadow:none}.ui.secondary.menu .item{-ms-flex-item-align:center;align-self:center;-webkit-box-shadow:none;box-shadow:none;border:none;padding:.75em .91666667em;margin:0 .41666667em;background:0 0;-webkit-transition:color .1s ease;transition:color .1s ease;border-radius:.33333333rem}.ui.secondary.menu .item:before{display:none!important}.ui.secondary.menu .header.item{border-radius:0;border-right:none;background:none transparent}.ui.secondary.menu .item>img:not(.ui){margin:0}.ui.secondary.menu .dropdown.item:hover,.ui.secondary.menu .link.item:hover,.ui.secondary.menu a.item:hover{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95)}.ui.secondary.menu .active.item{-webkit-box-shadow:none;box-shadow:none;background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);border-radius:.33333333rem}.ui.secondary.menu .active.item:hover{-webkit-box-shadow:none;box-shadow:none;background:rgba(0,0,0,.05);color:rgba(0,0,0,.95)}.ui.secondary.inverted.menu .link.item:not(.disabled),.ui.secondary.inverted.menu a.item:not(.disabled){color:rgba(255,255,255,.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,.08);color:#fff}.ui.secondary.inverted.menu .active.item{background:rgba(255,255,255,.15);color:#fff}.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}.ui.vertical.secondary.menu .item:not(.dropdown)>.menu{margin:0 -.91666667em}.ui.vertical.secondary.menu .item:not(.dropdown)>.menu>.item{margin:0;padding:.58333333em 1.36111111em}.ui.secondary.vertical.menu>.item{border:none;margin:0 0 .41666667em;border-radius:.33333333rem!important}.ui.secondary.vertical.menu>.header.item{border-radius:0}.ui.vertical.secondary.menu .item>.menu .item{background-color:transparent}.ui.secondary.inverted.menu{background-color:transparent}.ui.secondary.pointing.menu{margin-left:0;margin-right:0;border-bottom:2px solid rgba(34,36,38,.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:.83333333em 1.16666667em;border-bottom-width:2px;-webkit-transition:color .1s ease;transition:color .1s ease}.ui.secondary.pointing.menu .ui.dropdown .menu .item{border-bottom-width:0}.ui.secondary.pointing.menu .item>.label:not(.floating){margin-top:-.3em;margin-bottom:-.3em}.ui.secondary.pointing.menu .item>.circular.label{margin-top:-.5em;margin-bottom:-.5em}.ui.secondary.pointing.menu .header.item{color:rgba(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}.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,.87)}.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,.15)}.ui.secondary.pointing.menu .active.item{background-color:transparent;-webkit-box-shadow:none;box-shadow:none;border-color:currentColor;font-weight:700;color:rgba(0,0,0,.95)}.ui.secondary.pointing.menu .active.item:hover{border-color:currentColor;color:rgba(0,0,0,.95)}.ui.secondary.pointing.menu .active.dropdown.item{border-color:transparent}.ui.secondary.vertical.pointing.menu{border-bottom-width:0;border-right-width:2px;border-right-style:solid;border-right-color:rgba(34,36,38,.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}.ui.secondary.vertical.pointing.menu .active.item{border-color:currentColor}.ui.secondary.inverted.pointing.menu{border-color:rgba(255,255,255,.1)}.ui.secondary.inverted.pointing.menu .item:not(.disabled){color:rgba(255,255,255,.9)}.ui.secondary.inverted.pointing.menu .header.item{color:#fff!important}.ui.secondary.inverted.pointing.menu .link.item:hover,.ui.secondary.inverted.pointing.menu a.item:hover{color:#fff}.ui.ui.secondary.inverted.pointing.menu .active.item{border-color:#fff;color:#fff;background-color:transparent}.ui.text.menu{background:none transparent;border-radius:0;-webkit-box-shadow:none;box-shadow:none;border:none;margin:1em -.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:.41666667em .58333333em;font-weight:400;color:rgba(0,0,0,.6);-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.ui.text.menu .item:before,.ui.text.menu .menu .item:before{display:none!important}.ui.text.menu .header.item{background-color:transparent;opacity:1;color:rgba(0,0,0,.85);font-size:.91666667em;text-transform:uppercase;font-weight:700}.ui.text.menu .item>img:not(.ui){margin:0}.ui.text.item.menu .item{margin:0}.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:.66666667em 0;padding-left:0;padding-right:0}.ui.vertical.text.menu .item>i.icon{float:none;margin:0 .41666667em 0 0}.ui.vertical.text.menu .header.item{margin:.66666667em 0 .83333333em}.ui.vertical.text.menu .item:not(.dropdown)>.menu{margin:0}.ui.vertical.text.menu .item:not(.dropdown)>.menu>.item{margin:0;padding:.58333333em 0}.ui.text.menu .item:hover{opacity:1;background-color:transparent}.ui.text.menu .active.item{background-color:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;font-weight:400;color:rgba(0,0,0,.95)}.ui.text.menu .active.item:hover{background-color:transparent}.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}.ui.inverted.text.menu,.ui.inverted.text.menu .active.item,.ui.inverted.text.menu .item,.ui.inverted.text.menu .item:hover{background-color:transparent}.ui.fluid.text.menu{margin-left:0;margin-right:0}.ui.vertical.icon.menu{display:inline-block;width:auto}.ui.icon.menu .item{height:auto;text-align:center;color:#1b1c1d}.ui.icon.menu .item>i.icon:not(.dropdown){margin:0;opacity:1}.ui.icon.menu i.icon:before{opacity:1}.ui.menu .icon.item>i.icon{width:auto;margin:0 auto}.ui.vertical.icon.menu .item>i.icon:not(.dropdown){display:block;opacity:1;margin:0 auto;float:none}.ui.inverted.icon.menu .item{color:#fff}.ui.labeled.icon.menu{text-align:center}.ui.labeled.icon.menu .item{min-width:6em;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ui.labeled.icon.menu>.item>i.icon:not(.dropdown){height:1em;display:block;font-size:1.75em!important;margin:0 auto .5rem!important}.ui.fluid.labeled.icon.menu>.item{min-width:0}@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,.1)}.ui.stackable.menu .left.item,.ui.stackable.menu .left.menu{margin-right:0!important}.ui.stackable.menu .right.item,.ui.stackable.menu .right.menu{margin-left:0!important}.ui.stackable.menu .center.item,.ui.stackable.menu .center.menu{margin-left:0!important;margin-right:0!important}.ui.stackable.menu .center.menu,.ui.stackable.menu .left.menu,.ui.stackable.menu .right.menu{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.ui.ui.primary.menu .active.item,.ui.ui.primary.menu .active.item:hover,.ui.ui.ui.menu .primary.active.item{color:#6435c9}.ui.ui.red.menu .active.item,.ui.ui.red.menu .active.item:hover,.ui.ui.ui.menu .red.active.item{color:#db2828}.ui.ui.orange.menu .active.item,.ui.ui.orange.menu .active.item:hover,.ui.ui.ui.menu .orange.active.item{color:#f2711c}.ui.ui.ui.menu .yellow.active.item,.ui.ui.yellow.menu .active.item,.ui.ui.yellow.menu .active.item:hover{color:#fbbd08}.ui.ui.olive.menu .active.item,.ui.ui.olive.menu .active.item:hover,.ui.ui.ui.menu .olive.active.item{color:#b5cc18}.ui.ui.green.menu .active.item,.ui.ui.green.menu .active.item:hover,.ui.ui.ui.menu .green.active.item{color:#21ba45}.ui.ui.teal.menu .active.item,.ui.ui.teal.menu .active.item:hover,.ui.ui.ui.menu .teal.active.item{color:#00b5ad}.ui.ui.blue.menu .active.item,.ui.ui.blue.menu .active.item:hover,.ui.ui.ui.menu .blue.active.item{color:#2185d0}.ui.ui.ui.menu .violet.active.item,.ui.ui.violet.menu .active.item,.ui.ui.violet.menu .active.item:hover{color:#6435c9}.ui.ui.purple.menu .active.item,.ui.ui.purple.menu .active.item:hover,.ui.ui.ui.menu .purple.active.item{color:#a333c8}.ui.ui.pink.menu .active.item,.ui.ui.pink.menu .active.item:hover,.ui.ui.ui.menu .pink.active.item{color:#e03997}.ui.ui.brown.menu .active.item,.ui.ui.brown.menu .active.item:hover,.ui.ui.ui.menu .brown.active.item{color:#a5673f}.ui.ui.grey.menu .active.item,.ui.ui.grey.menu .active.item:hover,.ui.ui.ui.menu .grey.active.item{color:#767676}.ui.ui.black.menu .active.item,.ui.ui.black.menu .active.item:hover,.ui.ui.ui.menu .black.active.item{color:#1b1c1d}.ui.inverted.menu{border:0 solid transparent;background:#1b1c1d;-webkit-box-shadow:none;box-shadow:none}.ui.inverted.menu .item,.ui.inverted.menu .item>a:not(.ui){background:0 0;color:rgba(255,255,255,.9)}.ui.inverted.menu .item.menu{background:0 0}.ui.inverted.menu .item:before{background:rgba(255,255,255,.08)}.ui.vertical.inverted.menu .item:before{background:rgba(255,255,255,.08)}.ui.vertical.inverted.menu .menu .item,.ui.vertical.inverted.menu .menu .item a:not(.ui){color:rgba(255,255,255,.5)}.ui.inverted.menu .header.item{margin:0;background:0 0;-webkit-box-shadow:none;box-shadow:none}.ui.ui.inverted.menu .item.disabled{color:rgba(225,225,225,.3)}.ui.inverted.menu .dropdown.item:hover,.ui.inverted.menu .link.item:hover,.ui.inverted.menu a.item:hover,.ui.link.inverted.menu .item:hover{background:rgba(255,255,255,.08);color:#fff}.ui.vertical.inverted.menu .item .menu .link.item:hover,.ui.vertical.inverted.menu .item .menu a.item:hover{background:0 0;color:#fff}.ui.inverted.menu .link.item:active,.ui.inverted.menu a.item:active{background:rgba(255,255,255,.08);color:#fff}.ui.inverted.menu .active.item{background:#3d3e3f;color:#fff!important}.ui.inverted.vertical.menu .item .menu .active.item{background:0 0;color:#fff}.ui.inverted.pointing.menu .active.item:after{background:#3d3e3f;margin:0!important;-webkit-box-shadow:none!important;box-shadow:none!important;border:none!important}.ui.inverted.menu .active.item:hover{background:#3d3e3f;color:#fff!important}.ui.inverted.pointing.menu .active.item:hover:after{background:#3d3e3f}.ui.floated.menu{float:left;margin:0 .5rem 0 0}.ui.floated.menu .item:last-child:before{display:none}.ui.right.floated.menu{float:right;margin:0 0 0 .5rem}.ui.ui.inverted.primary.menu,.ui.ui.ui.inverted.menu .primary.active.item{background-color:#6435c9}.ui.inverted.primary.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.primary.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.primary.menu .active.item{background-color:#5829bb}.ui.ui.inverted.red.menu,.ui.ui.ui.inverted.menu .red.active.item{background-color:#db2828}.ui.inverted.red.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.red.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.red.menu .active.item{background-color:#d01919}.ui.ui.inverted.orange.menu,.ui.ui.ui.inverted.menu .orange.active.item{background-color:#f2711c}.ui.inverted.orange.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.orange.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.orange.menu .active.item{background-color:#f26202}.ui.ui.inverted.yellow.menu,.ui.ui.ui.inverted.menu .yellow.active.item{background-color:#fbbd08}.ui.inverted.yellow.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.yellow.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.yellow.menu .active.item{background-color:#eaae00}.ui.ui.inverted.olive.menu,.ui.ui.ui.inverted.menu .olive.active.item{background-color:#b5cc18}.ui.inverted.olive.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.olive.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.olive.menu .active.item{background-color:#a7bd0d}.ui.ui.inverted.green.menu,.ui.ui.ui.inverted.menu .green.active.item{background-color:#21ba45}.ui.inverted.green.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.green.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.green.menu .active.item{background-color:#16ab39}.ui.ui.inverted.teal.menu,.ui.ui.ui.inverted.menu .teal.active.item{background-color:#00b5ad}.ui.inverted.teal.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.teal.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.teal.menu .active.item{background-color:#009c95}.ui.ui.inverted.blue.menu,.ui.ui.ui.inverted.menu .blue.active.item{background-color:#2185d0}.ui.inverted.blue.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.blue.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.blue.menu .active.item{background-color:#1678c2}.ui.ui.inverted.violet.menu,.ui.ui.ui.inverted.menu .violet.active.item{background-color:#6435c9}.ui.inverted.violet.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.violet.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.violet.menu .active.item{background-color:#5829bb}.ui.ui.inverted.purple.menu,.ui.ui.ui.inverted.menu .purple.active.item{background-color:#a333c8}.ui.inverted.purple.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.purple.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.purple.menu .active.item{background-color:#9627ba}.ui.ui.inverted.pink.menu,.ui.ui.ui.inverted.menu .pink.active.item{background-color:#e03997}.ui.inverted.pink.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.pink.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.pink.menu .active.item{background-color:#e61a8d}.ui.ui.inverted.brown.menu,.ui.ui.ui.inverted.menu .brown.active.item{background-color:#a5673f}.ui.inverted.brown.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.brown.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.brown.menu .active.item{background-color:#975b33}.ui.ui.inverted.grey.menu,.ui.ui.ui.inverted.menu .grey.active.item{background-color:#767676}.ui.inverted.grey.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.grey.menu .active.item{background-color:rgba(0,0,0,.1)}.ui.inverted.pointing.grey.menu .active.item{background-color:#838383}.ui.ui.inverted.black.menu,.ui.ui.ui.inverted.menu .black.active.item{background-color:#1b1c1d}.ui.inverted.black.menu .item:before{background-color:rgba(34,36,38,.1)}.ui.ui.inverted.black.menu .active.item{background-color:rgba(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}.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:.91666667em;padding-bottom:.91666667em}.ui.menu .vertically.fitted.item,.ui.vertically.fitted.menu .item,.ui.vertically.fitted.menu .item .menu .item{padding-left:1.16666667em;padding-right:1.16666667em}.ui.borderless.menu .item .menu .item:before,.ui.borderless.menu .item:before,.ui.menu .borderless.item:before{background:0 0!important}.ui.compact.menu{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin:0;vertical-align:middle}.ui.compact.vertical.menu{display:-ms-inline-flexbox!important;display:inline-block}.ui.compact.menu:not(.secondary) .item:last-child{border-radius:0 .33333333rem .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}.ui.menu.fluid,.ui.vertical.menu.fluid{width:100%!important}.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%}.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%}.ui.fixed.menu+.ui.grid{padding-top:2.75rem}.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:0 0;margin:.5px 0 0;width:.66666667em;height:.66666667em;border:none;border-bottom:1px solid #d4d4d5;border-right:1px solid #d4d4d5;z-index:2;-webkit-transition:background .1s ease;transition:background .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 -.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}.ui.pointing.menu .active.item:after{visibility:visible}.ui.pointing.menu .active.dropdown.item:after{visibility:hidden}.ui.pointing.menu .active.item .menu .active.item:after,.ui.pointing.menu .dropdown.active.item:after{display:none}.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:#fff}.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}.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}.ui[class*="top attached"].menu{bottom:0;margin-bottom:0;top:0;margin-top:1rem;border-radius:.33333333rem .33333333rem 0 0}.ui.menu[class*="top attached"]:first-child{margin-top:0}.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,.15),none;box-shadow:0 1px 2px 0 rgba(34,36,38,.15),none;border-radius:0 0 .33333333rem .33333333rem}.ui[class*="bottom attached"].menu:last-child{margin-bottom:0}.ui.top.attached.menu>.item:first-child{border-radius:.33333333rem 0 0 0}.ui.bottom.attached.menu>.item:first-child{border-radius:0 0 0 .33333333rem}.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%}.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:.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}.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,.8)!important}.ui.menu .ui.inverted.dropdown .menu>.active.item{background:0 0!important;color:rgba(255,255,255,.8)!important}.ui.menu .ui.inverted.dropdown .menu>.item:hover{background:rgba(255,255,255,.08)!important;color:rgba(255,255,255,.8)!important}.ui.menu .ui.inverted.dropdown .menu>.selected.item{background:rgba(255,255,255,.15)!important;color:rgba(255,255,255,.8)!important}.ui.vertical.menu .inverted.dropdown.item .menu{-webkit-box-shadow:none;box-shadow:none} \ No newline at end of file diff --git a/semantic/dist/components/tab.css b/semantic/dist/components/tab.css new file mode 100644 index 00000000..4698e9a4 --- /dev/null +++ b/semantic/dist/components/tab.css @@ -0,0 +1,88 @@ +/*! + * # 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 +*******************************/ + diff --git a/semantic/dist/components/tab.js b/semantic/dist/components/tab.js new file mode 100644 index 00000000..9827168a --- /dev/null +++ b/semantic/dist/components/tab.js @@ -0,0 +1,1001 @@ +/*! + * # Fomantic-UI 2.8.8 - Tab + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ + +;(function ($, window, document, undefined) { + +'use strict'; + +$.isWindow = $.isWindow || function(obj) { + return obj != null && obj === obj.window; +}; +$.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.tab = function(parameters) { + + var + // use window context if none specified + $allModules = $.isFunction(this) + ? $(window) + : $(this), + + moduleSelector = $allModules.selector || '', + time = new Date().getTime(), + performance = [], + + query = arguments[0], + methodInvoked = (typeof query == 'string'), + queryArguments = [].slice.call(arguments, 1), + + initializedHistory = false, + returnedValue + ; + + $allModules + .each(function() { + var + + settings = ( $.isPlainObject(parameters) ) + ? $.extend(true, {}, $.fn.tab.settings, parameters) + : $.extend({}, $.fn.tab.settings), + + className = settings.className, + metadata = settings.metadata, + selector = settings.selector, + error = settings.error, + regExp = settings.regExp, + + eventNamespace = '.' + settings.namespace, + moduleNamespace = 'module-' + settings.namespace, + + $module = $(this), + $context, + $tabs, + + cache = {}, + firstLoad = true, + recursionDepth = 0, + element = this, + instance = $module.data(moduleNamespace), + + activeTabPath, + parameterArray, + module, + + historyEvent + + ; + + module = { + + initialize: function() { + module.debug('Initializing tab menu item', $module); + module.fix.callbacks(); + module.determineTabs(); + + module.debug('Determining tabs', settings.context, $tabs); + // set up automatic routing + if(settings.auto) { + module.set.auto(); + } + module.bind.events(); + + if(settings.history && !initializedHistory) { + module.initializeHistory(); + initializedHistory = true; + } + + if(settings.autoTabActivation && instance === undefined && module.determine.activeTab() == null) { + module.debug('No active tab detected, setting first tab active', module.get.initialPath()); + module.changeTab(settings.autoTabActivation === true ? module.get.initialPath() : settings.autoTabActivation); + }; + + module.instantiate(); + }, + + instantiate: function () { + module.verbose('Storing instance of module', module); + instance = module; + $module + .data(moduleNamespace, module) + ; + }, + + destroy: function() { + module.debug('Destroying tabs', $module); + $module + .removeData(moduleNamespace) + .off(eventNamespace) + ; + }, + + bind: { + events: function() { + // if using $.tab don't add events + if( !$.isWindow( element ) ) { + module.debug('Attaching tab activation events to element', $module); + $module + .on('click' + eventNamespace, module.event.click) + ; + } + } + }, + + determineTabs: function() { + var + $reference + ; + + // determine tab context + if(settings.context === 'parent') { + if($module.closest(selector.ui).length > 0) { + $reference = $module.closest(selector.ui); + module.verbose('Using closest UI element as parent', $reference); + } + else { + $reference = $module; + } + $context = $reference.parent(); + module.verbose('Determined parent element for creating context', $context); + } + else if(settings.context) { + $context = $(settings.context); + module.verbose('Using selector for tab context', settings.context, $context); + } + else { + $context = $('body'); + } + // find tabs + if(settings.childrenOnly) { + $tabs = $context.children(selector.tabs); + module.debug('Searching tab context children for tabs', $context, $tabs); + } + else { + $tabs = $context.find(selector.tabs); + module.debug('Searching tab context for tabs', $context, $tabs); + } + }, + + fix: { + callbacks: function() { + if( $.isPlainObject(parameters) && (parameters.onTabLoad || parameters.onTabInit) ) { + if(parameters.onTabLoad) { + parameters.onLoad = parameters.onTabLoad; + delete parameters.onTabLoad; + module.error(error.legacyLoad, parameters.onLoad); + } + if(parameters.onTabInit) { + parameters.onFirstLoad = parameters.onTabInit; + delete parameters.onTabInit; + module.error(error.legacyInit, parameters.onFirstLoad); + } + settings = $.extend(true, {}, $.fn.tab.settings, parameters); + } + } + }, + + initializeHistory: function() { + module.debug('Initializing page state'); + if( $.address === undefined ) { + module.error(error.state); + return false; + } + else { + if(settings.historyType == 'state') { + module.debug('Using HTML5 to manage state'); + if(settings.path !== false) { + $.address + .history(true) + .state(settings.path) + ; + } + else { + module.error(error.path); + return false; + } + } + $.address + .bind('change', module.event.history.change) + ; + } + }, + + event: { + click: function(event) { + var + tabPath = $(this).data(metadata.tab) + ; + if(tabPath !== undefined) { + if(settings.history) { + module.verbose('Updating page state', event); + $.address.value(tabPath); + } + else { + module.verbose('Changing tab', event); + module.changeTab(tabPath); + } + event.preventDefault(); + } + else { + module.debug('No tab specified'); + } + }, + history: { + change: function(event) { + var + tabPath = event.pathNames.join('/') || module.get.initialPath(), + pageTitle = settings.templates.determineTitle(tabPath) || false + ; + module.performance.display(); + module.debug('History change event', tabPath, event); + historyEvent = event; + if(tabPath !== undefined) { + module.changeTab(tabPath); + } + if(pageTitle) { + $.address.title(pageTitle); + } + } + } + }, + + refresh: function() { + if(activeTabPath) { + module.debug('Refreshing tab', activeTabPath); + module.changeTab(activeTabPath); + } + }, + + cache: { + + read: function(cacheKey) { + return (cacheKey !== undefined) + ? cache[cacheKey] + : false + ; + }, + add: function(cacheKey, content) { + cacheKey = cacheKey || activeTabPath; + module.debug('Adding cached content for', cacheKey); + cache[cacheKey] = content; + }, + remove: function(cacheKey) { + cacheKey = cacheKey || activeTabPath; + module.debug('Removing cached content for', cacheKey); + delete cache[cacheKey]; + } + }, + + escape: { + string: function(text) { + text = String(text); + return text.replace(regExp.escape, '\\$&'); + } + }, + + set: { + auto: function() { + var + url = (typeof settings.path == 'string') + ? settings.path.replace(/\/$/, '') + '/{$tab}' + : '/{$tab}' + ; + module.verbose('Setting up automatic tab retrieval from server', url); + if($.isPlainObject(settings.apiSettings)) { + settings.apiSettings.url = url; + } + else { + settings.apiSettings = { + url: url + }; + } + }, + loading: function(tabPath) { + var + $tab = module.get.tabElement(tabPath), + isLoading = $tab.hasClass(className.loading) + ; + if(!isLoading) { + module.verbose('Setting loading state for', $tab); + $tab + .addClass(className.loading) + .siblings($tabs) + .removeClass(className.active + ' ' + className.loading) + ; + if($tab.length > 0) { + settings.onRequest.call($tab[0], tabPath); + } + } + }, + state: function(state) { + $.address.value(state); + } + }, + + changeTab: function(tabPath) { + var + pushStateAvailable = (window.history && window.history.pushState), + shouldIgnoreLoad = (pushStateAvailable && settings.ignoreFirstLoad && firstLoad), + remoteContent = (settings.auto || $.isPlainObject(settings.apiSettings) ), + // only add default path if not remote content + pathArray = (remoteContent && !shouldIgnoreLoad) + ? module.utilities.pathToArray(tabPath) + : module.get.defaultPathArray(tabPath) + ; + tabPath = module.utilities.arrayToPath(pathArray); + $.each(pathArray, function(index, tab) { + var + currentPathArray = pathArray.slice(0, index + 1), + currentPath = module.utilities.arrayToPath(currentPathArray), + + isTab = module.is.tab(currentPath), + isLastIndex = (index + 1 == pathArray.length), + + $tab = module.get.tabElement(currentPath), + $anchor, + nextPathArray, + nextPath, + isLastTab + ; + module.verbose('Looking for tab', tab); + if(isTab) { + module.verbose('Tab was found', tab); + // scope up + activeTabPath = currentPath; + parameterArray = module.utilities.filterArray(pathArray, currentPathArray); + + if(isLastIndex) { + isLastTab = true; + } + else { + nextPathArray = pathArray.slice(0, index + 2); + nextPath = module.utilities.arrayToPath(nextPathArray); + isLastTab = ( !module.is.tab(nextPath) ); + if(isLastTab) { + module.verbose('Tab parameters found', nextPathArray); + } + } + if(isLastTab && remoteContent) { + if(!shouldIgnoreLoad) { + module.activate.navigation(currentPath); + module.fetch.content(currentPath, tabPath); + } + else { + module.debug('Ignoring remote content on first tab load', currentPath); + firstLoad = false; + module.cache.add(tabPath, $tab.html()); + module.activate.all(currentPath); + settings.onFirstLoad.call($tab[0], currentPath, parameterArray, historyEvent); + settings.onLoad.call($tab[0], currentPath, parameterArray, historyEvent); + } + return false; + } + else { + module.debug('Opened local tab', currentPath); + module.activate.all(currentPath); + if( !module.cache.read(currentPath) ) { + module.cache.add(currentPath, true); + module.debug('First time tab loaded calling tab init'); + settings.onFirstLoad.call($tab[0], currentPath, parameterArray, historyEvent); + } + settings.onLoad.call($tab[0], currentPath, parameterArray, historyEvent); + } + + } + else if(tabPath.search('/') == -1 && tabPath !== '') { + // look for in page anchor + tabPath = module.escape.string(tabPath); + $anchor = $('#' + tabPath + ', a[name="' + tabPath + '"]'); + currentPath = $anchor.closest('[data-tab]').data(metadata.tab); + $tab = module.get.tabElement(currentPath); + // if anchor exists use parent tab + if($anchor && $anchor.length > 0 && currentPath) { + module.debug('Anchor link used, opening parent tab', $tab, $anchor); + if( !$tab.hasClass(className.active) ) { + setTimeout(function() { + module.scrollTo($anchor); + }, 0); + } + module.activate.all(currentPath); + if( !module.cache.read(currentPath) ) { + module.cache.add(currentPath, true); + module.debug('First time tab loaded calling tab init'); + settings.onFirstLoad.call($tab[0], currentPath, parameterArray, historyEvent); + } + settings.onLoad.call($tab[0], currentPath, parameterArray, historyEvent); + return false; + } + } + else { + module.error(error.missingTab, $module, $context, currentPath); + return false; + } + }); + }, + + scrollTo: function($element) { + var + scrollOffset = ($element && $element.length > 0) + ? $element.offset().top + : false + ; + if(scrollOffset !== false) { + module.debug('Forcing scroll to an in-page link in a hidden tab', scrollOffset, $element); + $(document).scrollTop(scrollOffset); + } + }, + + update: { + content: function(tabPath, html, evaluateScripts) { + var + $tab = module.get.tabElement(tabPath), + tab = $tab[0] + ; + evaluateScripts = (evaluateScripts !== undefined) + ? evaluateScripts + : settings.evaluateScripts + ; + if(typeof settings.cacheType == 'string' && settings.cacheType.toLowerCase() == 'dom' && typeof html !== 'string') { + $tab + .empty() + .append($(html).clone(true)) + ; + } + else { + if(evaluateScripts) { + module.debug('Updating HTML and evaluating inline scripts', tabPath, html); + $tab.html(html); + } + else { + module.debug('Updating HTML', tabPath, html); + tab.innerHTML = html; + } + } + } + }, + + fetch: { + + content: function(tabPath, fullTabPath) { + var + $tab = module.get.tabElement(tabPath), + apiSettings = { + dataType : 'html', + encodeParameters : false, + on : 'now', + cache : settings.alwaysRefresh, + headers : { + 'X-Remote': true + }, + onSuccess : function(response) { + if(settings.cacheType == 'response') { + module.cache.add(fullTabPath, response); + } + module.update.content(tabPath, response); + if(tabPath == activeTabPath) { + module.debug('Content loaded', tabPath); + module.activate.tab(tabPath); + } + else { + module.debug('Content loaded in background', tabPath); + } + settings.onFirstLoad.call($tab[0], tabPath, parameterArray, historyEvent); + settings.onLoad.call($tab[0], tabPath, parameterArray, historyEvent); + + if(settings.loadOnce) { + module.cache.add(fullTabPath, true); + } + else if(typeof settings.cacheType == 'string' && settings.cacheType.toLowerCase() == 'dom' && $tab.children().length > 0) { + setTimeout(function() { + var + $clone = $tab.children().clone(true) + ; + $clone = $clone.not('script'); + module.cache.add(fullTabPath, $clone); + }, 0); + } + else { + module.cache.add(fullTabPath, $tab.html()); + } + }, + urlData: { + tab: fullTabPath + } + }, + request = $tab.api('get request') || false, + existingRequest = ( request && request.state() === 'pending' ), + requestSettings, + cachedContent + ; + + fullTabPath = fullTabPath || tabPath; + cachedContent = module.cache.read(fullTabPath); + + + if(settings.cache && cachedContent) { + module.activate.tab(tabPath); + module.debug('Adding cached content', fullTabPath); + if(!settings.loadOnce) { + if(settings.evaluateScripts == 'once') { + module.update.content(tabPath, cachedContent, false); + } + else { + module.update.content(tabPath, cachedContent); + } + } + settings.onLoad.call($tab[0], tabPath, parameterArray, historyEvent); + } + else if(existingRequest) { + module.set.loading(tabPath); + module.debug('Content is already loading', fullTabPath); + } + else if($.api !== undefined) { + requestSettings = $.extend(true, {}, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + module.set.loading(tabPath); + $tab.api(requestSettings); + } + else { + module.error(error.api); + } + } + }, + + activate: { + all: function(tabPath) { + module.activate.tab(tabPath); + module.activate.navigation(tabPath); + }, + tab: function(tabPath) { + var + $tab = module.get.tabElement(tabPath), + $deactiveTabs = (settings.deactivate == 'siblings') + ? $tab.siblings($tabs) + : $tabs.not($tab), + isActive = $tab.hasClass(className.active) + ; + module.verbose('Showing tab content for', $tab); + if(!isActive) { + $tab + .addClass(className.active) + ; + $deactiveTabs + .removeClass(className.active + ' ' + className.loading) + ; + if($tab.length > 0) { + settings.onVisible.call($tab[0], tabPath); + } + } + }, + navigation: function(tabPath) { + var + $navigation = module.get.navElement(tabPath), + $deactiveNavigation = (settings.deactivate == 'siblings') + ? $navigation.siblings($allModules) + : $allModules.not($navigation), + isActive = $navigation.hasClass(className.active) + ; + module.verbose('Activating tab navigation for', $navigation, tabPath); + if(!isActive) { + $navigation + .addClass(className.active) + ; + $deactiveNavigation + .removeClass(className.active + ' ' + className.loading) + ; + } + } + }, + + deactivate: { + all: function() { + module.deactivate.navigation(); + module.deactivate.tabs(); + }, + navigation: function() { + $allModules + .removeClass(className.active) + ; + }, + tabs: function() { + $tabs + .removeClass(className.active + ' ' + className.loading) + ; + } + }, + + is: { + tab: function(tabName) { + return (tabName !== undefined) + ? ( module.get.tabElement(tabName).length > 0 ) + : false + ; + } + }, + + get: { + initialPath: function() { + return $allModules.eq(0).data(metadata.tab) || $tabs.eq(0).data(metadata.tab); + }, + path: function() { + return $.address.value(); + }, + // adds default tabs to tab path + defaultPathArray: function(tabPath) { + return module.utilities.pathToArray( module.get.defaultPath(tabPath) ); + }, + defaultPath: function(tabPath) { + var + $defaultNav = $allModules.filter('[data-' + metadata.tab + '^="' + module.escape.string(tabPath) + '/"]').eq(0), + defaultTab = $defaultNav.data(metadata.tab) || false + ; + if( defaultTab ) { + module.debug('Found default tab', defaultTab); + if(recursionDepth < settings.maxDepth) { + recursionDepth++; + return module.get.defaultPath(defaultTab); + } + module.error(error.recursion); + } + else { + module.debug('No default tabs found for', tabPath, $tabs); + } + recursionDepth = 0; + return tabPath; + }, + navElement: function(tabPath) { + tabPath = tabPath || activeTabPath; + return $allModules.filter('[data-' + metadata.tab + '="' + module.escape.string(tabPath) + '"]'); + }, + tabElement: function(tabPath) { + var + $fullPathTab, + $simplePathTab, + tabPathArray, + lastTab + ; + tabPath = tabPath || activeTabPath; + tabPathArray = module.utilities.pathToArray(tabPath); + lastTab = module.utilities.last(tabPathArray); + $fullPathTab = $tabs.filter('[data-' + metadata.tab + '="' + module.escape.string(tabPath) + '"]'); + $simplePathTab = $tabs.filter('[data-' + metadata.tab + '="' + module.escape.string(lastTab) + '"]'); + return ($fullPathTab.length > 0) + ? $fullPathTab + : $simplePathTab + ; + }, + tab: function() { + return activeTabPath; + } + }, + + determine: { + activeTab: function() { + var activeTab = null; + + $tabs.each(function(_index, tab) { + var $tab = $(tab); + + if( $tab.hasClass(className.active) ) { + var + tabPath = $(this).data(metadata.tab), + $anchor = $allModules.filter('[data-' + metadata.tab + '="' + module.escape.string(tabPath) + '"]') + ; + + if( $anchor.hasClass(className.active) ) { + activeTab = tabPath; + } + } + }); + + return activeTab; + } + }, + + utilities: { + filterArray: function(keepArray, removeArray) { + return $.grep(keepArray, function(keepValue) { + return ( $.inArray(keepValue, removeArray) == -1); + }); + }, + last: function(array) { + return Array.isArray(array) + ? array[ array.length - 1] + : false + ; + }, + pathToArray: function(pathName) { + if(pathName === undefined) { + pathName = activeTabPath; + } + return typeof pathName == 'string' + ? pathName.split('/') + : [pathName] + ; + }, + arrayToPath: function(pathArray) { + return Array.isArray(pathArray) + ? pathArray.join('/') + : false + ; + } + }, + + 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 + ; + +}; + +// shortcut for tabbed content with no defined navigation +$.tab = function() { + $(window).tab.apply(this, arguments); +}; + +$.fn.tab.settings = { + + name : 'Tab', + namespace : 'tab', + + silent : false, + debug : false, + verbose : false, + performance : true, + + auto : false, // uses pjax style endpoints fetching content from same url with remote-content headers + history : false, // use browser history + historyType : 'hash', // #/ or html5 state + path : false, // base path of url + + context : false, // specify a context that tabs must appear inside + childrenOnly : false, // use only tabs that are children of context + maxDepth : 25, // max depth a tab can be nested + + deactivate : 'siblings', // whether tabs should deactivate sibling menu elements or all elements initialized together + + alwaysRefresh : false, // load tab content new every tab click + cache : true, // cache the content requests to pull locally + loadOnce : false, // Whether tab data should only be loaded once when using remote content + cacheType : 'response', // Whether to cache exact response, or to html cache contents after scripts execute + ignoreFirstLoad : false, // don't load remote content on first load + + apiSettings : false, // settings for api call + evaluateScripts : 'once', // whether inline scripts should be parsed (true/false/once). Once will not re-evaluate on cached content + autoTabActivation: true, // whether a non existing active tab will auto activate the first available tab + + onFirstLoad : function(tabPath, parameterArray, historyEvent) {}, // called first time loaded + onLoad : function(tabPath, parameterArray, historyEvent) {}, // called on every load + onVisible : function(tabPath, parameterArray, historyEvent) {}, // called every time tab visible + onRequest : function(tabPath, parameterArray, historyEvent) {}, // called ever time a tab beings loading remote content + + templates : { + determineTitle: function(tabArray) {} // returns page title for path + }, + + error: { + api : 'You attempted to load content without API module', + method : 'The method you called is not defined', + missingTab : 'Activated tab cannot be found. Tabs are case-sensitive.', + noContent : 'The tab you specified is missing a content url.', + path : 'History enabled, but no path was specified', + recursion : 'Max recursive depth reached', + legacyInit : 'onTabInit has been renamed to onFirstLoad in 2.0, please adjust your code.', + legacyLoad : 'onTabLoad has been renamed to onLoad in 2.0. Please adjust your code', + state : 'History requires Asual\'s Address library ' + }, + + regExp : { + escape : /[-[\]{}()*+?.,\\^$|#\s:=@]/g + }, + + metadata : { + tab : 'tab', + loaded : 'loaded', + promise: 'promise' + }, + + className : { + loading : 'loading', + active : 'active' + }, + + selector : { + tabs : '.ui.tab', + ui : '.ui' + } + +}; + +})( jQuery, window, document ); diff --git a/semantic/dist/components/tab.min.css b/semantic/dist/components/tab.min.css new file mode 100644 index 00000000..2a681c25 --- /dev/null +++ b/semantic/dist/components/tab.min.css @@ -0,0 +1,9 @@ +/*! + * # Fomantic-UI 2.8.8 - Tab + * http://github.com/fomantic/Fomantic-UI/ + * + * + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */.ui.tab{display:none}.ui.tab.active,.ui.tab.open{display:block}.ui.tab.loading{position:relative;overflow:hidden;display:block;min-height:250px}.ui.tab.loading *{position:relative!important;left:-10000px!important}.ui.tab.loading.segment:before,.ui.tab.loading: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:.2em solid rgba(0,0,0,.1)}.ui.tab.loading.segment:after,.ui.tab.loading:after{position:absolute;content:'';top:50%;left:50%;margin:-1.25em 0 0 -1.25em;width:2.5em;height:2.5em;-webkit-animation:loader .6s infinite linear;animation:loader .6s infinite linear;border:.2em solid #767676;border-radius:500rem;-webkit-box-shadow:0 0 0 1px transparent;box-shadow:0 0 0 1px transparent} \ No newline at end of file diff --git a/semantic/dist/components/tab.min.js b/semantic/dist/components/tab.min.js new file mode 100644 index 00000000..d90ed5bb --- /dev/null +++ b/semantic/dist/components/tab.min.js @@ -0,0 +1,11 @@ +/* + * # Fomantic UI - 2.8.8 + * https://github.com/fomantic/Fomantic-UI + * http://fomantic-ui.com/ + * + * Copyright 2022 Contributors + * Released under the MIT license + * http://opensource.org/licenses/MIT + * + */ +!function(j,O,k,I){"use strict";j.isWindow=j.isWindow||function(e){return null!=e&&e===e.window},j.isFunction=j.isFunction||function(e){return"function"==typeof e&&"number"!=typeof e.nodeType},O=void 0!==O&&O.Math==Math?O:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")(),j.fn.tab=function(l){var d,u=j.isFunction(this)?j(O):j(this),b=u.selector||"",P=(new Date).getTime(),C=[],F=l,w="string"==typeof F,S=[].slice.call(arguments,1),E=!1;return u.each(function(){var g,i,f,h,p,v=j.isPlainObject(l)?j.extend(!0,{},j.fn.tab.settings,l):j.extend({},j.fn.tab.settings),m=v.className,y=v.metadata,t=v.selector,T=v.error,a=v.regExp,e="."+v.namespace,n="module-"+v.namespace,L=j(this),o={},A=!0,r=0,s=this,c=L.data(n),x={initialize:function(){x.debug("Initializing tab menu item",L),x.fix.callbacks(),x.determineTabs(),x.debug("Determining tabs",v.context,i),v.auto&&x.set.auto(),x.bind.events(),v.history&&!E&&(x.initializeHistory(),E=!0),v.autoTabActivation&&c===I&&null==x.determine.activeTab()&&(x.debug("No active tab detected, setting first tab active",x.get.initialPath()),x.changeTab(!0===v.autoTabActivation?x.get.initialPath():v.autoTabActivation)),x.instantiate()},instantiate:function(){x.verbose("Storing instance of module",x),c=x,L.data(n,x)},destroy:function(){x.debug("Destroying tabs",L),L.removeData(n).off(e)},bind:{events:function(){j.isWindow(s)||(x.debug("Attaching tab activation events to element",L),L.on("click"+e,x.event.click))}},determineTabs:function(){var e;"parent"===v.context?(0