initial
This commit is contained in:
zbatte committed
commit
9883323161
17470 files changed
+4470592
No files matched your search
@@ -0,0 +1,76 @@
|
||||
.main-navigation .navigation-logo {
|
||||
float: left;
|
||||
display: block;
|
||||
margin-left: -10px;
|
||||
transition: height .3s ease;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.main-navigation .navigation-logo img {
|
||||
position: relative;
|
||||
vertical-align:middle;
|
||||
padding: 10px;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
transition: height .3s ease;
|
||||
}
|
||||
|
||||
.nav-float-left .main-navigation .navigation-logo {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.nav-float-left .main-navigation .navigation-logo {
|
||||
margin-left: 0;
|
||||
margin-right: -10px;
|
||||
}
|
||||
|
||||
.sticky-menu-logo .main-navigation .navigation-logo,
|
||||
.regular-menu-logo .navigation-stick .navigation-logo {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.sticky-menu-logo .navigation-stick:not(#sticky-placeholder) .navigation-logo {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.main-navigation.grid-container .navigation-logo,
|
||||
.main-navigation .inside-navigation:not(.grid-container) .navigation-logo {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.gen-sidebar-nav .main-navigation .navigation-logo {
|
||||
float: none;
|
||||
padding: 0;
|
||||
margin: 30px 0 !important;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gen-sidebar-nav .main-navigation .navigation-logo img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
vertical-align: bottom;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
body[class*="nav-float-"].menu-logo-enabled:not(.sticky-menu-logo) .main-navigation .navigation-logo,
|
||||
body[class*="nav-float-"].menu-logo-enabled:not(.sticky-menu-logo) .main-navigation .main-nav {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
body[class*="nav-float-"].menu-logo-enabled:not(.sticky-menu-logo) .main-navigation:not(.navigation-stick) .navigation-logo {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.using-floats .main-navigation:not(.slideout-navigation) .inside-navigation:before,
|
||||
.using-floats .main-navigation:not(.slideout-navigation) .inside-navigation:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
visibility: hidden;
|
||||
font-size: 0;
|
||||
line-height: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
.main-navigation .navigation-logo{float:left;display:block;margin-left:-10px;transition:height .3s ease;opacity:1}.main-navigation .navigation-logo img{position:relative;vertical-align:middle;padding:10px;display:block;box-sizing:border-box;transition:height .3s ease}.nav-float-left .main-navigation .navigation-logo{float:right}.nav-float-left .main-navigation .navigation-logo{margin-left:0;margin-right:-10px}.regular-menu-logo .navigation-stick .navigation-logo,.sticky-menu-logo .main-navigation .navigation-logo{display:none!important}.sticky-menu-logo .navigation-stick:not(#sticky-placeholder) .navigation-logo{display:block!important}.main-navigation .inside-navigation:not(.grid-container) .navigation-logo,.main-navigation.grid-container .navigation-logo{margin-left:0}.gen-sidebar-nav .main-navigation .navigation-logo{float:none;padding:0;margin:30px 0!important;text-align:center}.gen-sidebar-nav .main-navigation .navigation-logo img{height:auto;max-width:100%;vertical-align:bottom;padding:0;margin:0 auto}body[class*=nav-float-].menu-logo-enabled:not(.sticky-menu-logo) .main-navigation .main-nav,body[class*=nav-float-].menu-logo-enabled:not(.sticky-menu-logo) .main-navigation .navigation-logo{display:inline-block;vertical-align:middle}body[class*=nav-float-].menu-logo-enabled:not(.sticky-menu-logo) .main-navigation:not(.navigation-stick) .navigation-logo{margin:0}.using-floats .main-navigation:not(.slideout-navigation) .inside-navigation:after,.using-floats .main-navigation:not(.slideout-navigation) .inside-navigation:before{content:".";display:block;overflow:hidden;visibility:hidden;font-size:0;line-height:0;width:0;height:0}
|
||||
@@ -0,0 +1,116 @@
|
||||
.navigation-branding,
|
||||
.site-logo.mobile-header-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
order: 0;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.navigation-branding img,
|
||||
.site-logo.mobile-header-logo img {
|
||||
position: relative;
|
||||
padding: 10px 0;
|
||||
display: block;
|
||||
transition: height .3s ease;
|
||||
}
|
||||
|
||||
.navigation-branding > div + .main-title {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.navigation-branding .main-title {
|
||||
transition: line-height .3s ease;
|
||||
}
|
||||
|
||||
.navigation-branding .main-title a {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
text-transform: unset;
|
||||
}
|
||||
|
||||
.main-navigation.mobile-header-navigation {
|
||||
display: none;
|
||||
float: none;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.mobile-header-navigation.is_stuck {
|
||||
box-shadow: 0 2px 2px -2px rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.main-navigation .menu-toggle {
|
||||
flex-grow: 1;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.main-navigation.has-branding .menu-toggle,
|
||||
.main-navigation.has-sticky-branding.navigation-stick .menu-toggle {
|
||||
flex-grow: 0;
|
||||
padding-right: 20px;
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.main-navigation:not(.slideout-navigation) .mobile-bar-items + .menu-toggle {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.main-navigation.has-sticky-branding:not(.has-branding):not(.navigation-stick) .navigation-branding {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.nav-align-right .navigation-branding {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.main-navigation.has-branding:not([class*="nav-align-"]):not(.mobile-header-navigation) .inside-navigation,
|
||||
.main-navigation.has-sticky-branding.navigation-stick:not([class*="nav-align-"]):not(.mobile-header-navigation) .inside-navigation {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.main-navigation.has-branding:not([class*="nav-align-"]):not(.mobile-header-navigation) .menu-bar-items,
|
||||
.main-navigation.has-sticky-branding.navigation-stick:not([class*="nav-align-"]):not(.mobile-header-navigation) .menu-bar-items {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.nav-float-right .main-navigation.has-branding:not(.mobile-header-navigation) .menu-bar-items,
|
||||
.nav-float-right .main-navigation.has-sticky-branding.navigation-stick:not(.mobile-header-navigation) .menu-bar-items {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.mobile-header-navigation.has-menu-bar-items .mobile-header-logo {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.rtl .navigation-branding > div + .main-title {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.rtl .main-navigation.nav-align-right:not(.mobile-header-navigation) .navigation-branding {
|
||||
order: -10;
|
||||
}
|
||||
|
||||
.rtl .nav-align-right .navigation-branding {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.rtl .navigation-branding,
|
||||
.rtl .site-logo.mobile-header-logo {
|
||||
margin-left: auto;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.rtl .nav-align-center .navigation-branding,
|
||||
.rtl .nav-align-center .site-logo.mobile-header-logo,
|
||||
.rtl .nav-align-right .navigation-branding,
|
||||
.rtl .nav-align-right .site-logo.mobile-header-logo {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.rtl .nav-align-right .menu-bar-items {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.rtl .mobile-header-navigation.has-menu-bar-items .site-logo {
|
||||
margin-left: auto;
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
.navigation-branding,.site-logo.mobile-header-logo{display:flex;align-items:center;order:0;margin-right:10px}.navigation-branding img,.site-logo.mobile-header-logo img{position:relative;padding:10px 0;display:block;transition:height .3s ease}.navigation-branding>div+.main-title{margin-left:10px}.navigation-branding .main-title{transition:line-height .3s ease}.navigation-branding .main-title a{font-family:inherit;font-size:inherit;font-weight:inherit;text-transform:unset}.main-navigation.mobile-header-navigation{display:none;float:none;margin-bottom:0}.mobile-header-navigation.is_stuck{box-shadow:0 2px 2px -2px rgba(0,0,0,.2)}.main-navigation .menu-toggle{flex-grow:1;width:auto}.main-navigation.has-branding .menu-toggle,.main-navigation.has-sticky-branding.navigation-stick .menu-toggle{flex-grow:0;padding-right:20px;order:2}.main-navigation:not(.slideout-navigation) .mobile-bar-items+.menu-toggle{text-align:left}.main-navigation.has-sticky-branding:not(.has-branding):not(.navigation-stick) .navigation-branding{display:none}.nav-align-right .navigation-branding{margin-right:auto}.main-navigation.has-branding:not([class*=nav-align-]):not(.mobile-header-navigation) .inside-navigation,.main-navigation.has-sticky-branding.navigation-stick:not([class*=nav-align-]):not(.mobile-header-navigation) .inside-navigation{justify-content:flex-start}.main-navigation.has-branding:not([class*=nav-align-]):not(.mobile-header-navigation) .menu-bar-items,.main-navigation.has-sticky-branding.navigation-stick:not([class*=nav-align-]):not(.mobile-header-navigation) .menu-bar-items{margin-left:auto}.nav-float-right .main-navigation.has-branding:not(.mobile-header-navigation) .menu-bar-items,.nav-float-right .main-navigation.has-sticky-branding.navigation-stick:not(.mobile-header-navigation) .menu-bar-items{margin-left:0}.mobile-header-navigation.has-menu-bar-items .mobile-header-logo{margin-right:auto}.rtl .navigation-branding>div+.main-title{margin-right:10px}.rtl .main-navigation.nav-align-right:not(.mobile-header-navigation) .navigation-branding{order:-10}.rtl .nav-align-right .navigation-branding{margin-right:10px}.rtl .navigation-branding,.rtl .site-logo.mobile-header-logo{margin-left:auto;margin-right:0}.rtl .nav-align-center .navigation-branding,.rtl .nav-align-center .site-logo.mobile-header-logo,.rtl .nav-align-right .navigation-branding,.rtl .nav-align-right .site-logo.mobile-header-logo{margin-left:10px}.rtl .nav-align-right .menu-bar-items{margin-right:auto}.rtl .mobile-header-navigation.has-menu-bar-items .site-logo{margin-left:auto}
|
||||
@@ -0,0 +1,135 @@
|
||||
.navigation-branding,
|
||||
.site-logo.mobile-header-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
order: 1;
|
||||
margin-right: auto;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.rtl .navigation-branding,
|
||||
.rtl .site-logo.mobile-header-logo {
|
||||
margin-right: 10px;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.navigation-branding img,
|
||||
.site-logo.mobile-header-logo img {
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
padding: 10px 0;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
transition: height .3s ease;
|
||||
}
|
||||
|
||||
.navigation-branding img {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.navigation-branding .main-title {
|
||||
transition: line-height .3s ease;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.rtl .navigation-branding .main-title {
|
||||
margin-right: 0;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.mobile-header-navigation .navigation-branding .main-title {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.rtl .mobile-header-navigation .navigation-branding .main-title {
|
||||
margin-left: 0;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.navigation-branding .main-title a {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
text-transform: unset;
|
||||
}
|
||||
|
||||
.main-navigation:not(.grid-container):not(.mobile-header-navigation) .inside-navigation.grid-container .navigation-branding {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.rtl .main-navigation:not(.grid-container):not(.mobile-header-navigation) .inside-navigation.grid-container .navigation-branding {
|
||||
margin-left: auto;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.main-navigation.mobile-header-navigation {
|
||||
display: none;
|
||||
float: none;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.mobile-header-navigation.is_stuck {
|
||||
box-shadow: 0 2px 2px -2px rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.main-navigation.has-branding .inside-navigation,
|
||||
.main-navigation.has-sticky-branding.navigation-stick .inside-navigation,
|
||||
#mobile-header .inside-navigation {
|
||||
flex-wrap: wrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.main-navigation .menu-toggle {
|
||||
flex-grow: 1;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.main-navigation.has-branding .menu-toggle,
|
||||
.main-navigation.has-sticky-branding.navigation-stick .menu-toggle {
|
||||
flex-grow: 0;
|
||||
order: 3;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.main-navigation .mobile-bar-items {
|
||||
order: 2;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.main-navigation:not(.slideout-navigation):not(.has-branding):not(.has-sticky-branding) .menu-toggle,
|
||||
.main-navigation.navigation-stick:not(.has-sticky-branding):not(.has-branding) .menu-toggle {
|
||||
order: 1;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.main-navigation:not(.slideout-navigation) .mobile-bar-items + .menu-toggle {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.main-navigation:not(.slideout-navigation) .main-nav {
|
||||
order: 4;
|
||||
}
|
||||
|
||||
.mobile-bar-items {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.main-navigation.has-sticky-branding:not(.has-branding):not(.navigation-stick) .navigation-branding {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.nav-aligned-center .navigation-branding,
|
||||
.nav-aligned-left .navigation-branding {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.nav-aligned-center .main-navigation.has-branding .inside-navigation,
|
||||
.nav-aligned-center .main-navigation.has-sticky-branding.navigation-stick .inside-navigation {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.nav-aligned-left .main-navigation.has-branding:not(.slideout-navigation) .inside-navigation .main-nav,
|
||||
.nav-aligned-left .main-navigation.has-sticky-branding.navigation-stick .inside-navigation .main-nav {
|
||||
flex-grow: 1;
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
.navigation-branding,.site-logo.mobile-header-logo{display:flex;align-items:center;order:1;margin-right:auto;margin-left:10px}.rtl .navigation-branding,.rtl .site-logo.mobile-header-logo{margin-right:10px;margin-left:auto}.navigation-branding img,.site-logo.mobile-header-logo img{position:relative;vertical-align:middle;padding:10px 0;display:block;box-sizing:border-box;transition:height .3s ease}.navigation-branding img{margin-right:10px}.navigation-branding .main-title{transition:line-height .3s ease;margin-right:10px}.rtl .navigation-branding .main-title{margin-right:0;margin-left:10px}.mobile-header-navigation .navigation-branding .main-title{margin-left:10px}.rtl .mobile-header-navigation .navigation-branding .main-title{margin-left:0;margin-right:10px}.navigation-branding .main-title a{font-family:inherit;font-size:inherit;font-weight:inherit;text-transform:unset}.main-navigation:not(.grid-container):not(.mobile-header-navigation) .inside-navigation.grid-container .navigation-branding{margin-left:0}.rtl .main-navigation:not(.grid-container):not(.mobile-header-navigation) .inside-navigation.grid-container .navigation-branding{margin-left:auto;margin-right:0}.main-navigation.mobile-header-navigation{display:none;float:none;margin-bottom:0}.mobile-header-navigation.is_stuck{box-shadow:0 2px 2px -2px rgba(0,0,0,.2)}#mobile-header .inside-navigation,.main-navigation.has-branding .inside-navigation,.main-navigation.has-sticky-branding.navigation-stick .inside-navigation{flex-wrap:wrap;display:flex;align-items:center}.main-navigation .menu-toggle{flex-grow:1;width:auto}.main-navigation.has-branding .menu-toggle,.main-navigation.has-sticky-branding.navigation-stick .menu-toggle{flex-grow:0;order:3;padding-right:20px}.main-navigation .mobile-bar-items{order:2;position:relative}.main-navigation.navigation-stick:not(.has-sticky-branding):not(.has-branding) .menu-toggle,.main-navigation:not(.slideout-navigation):not(.has-branding):not(.has-sticky-branding) .menu-toggle{order:1;flex-grow:1}.main-navigation:not(.slideout-navigation) .mobile-bar-items+.menu-toggle{text-align:left}.main-navigation:not(.slideout-navigation) .main-nav{order:4}.mobile-bar-items{position:relative}.main-navigation.has-sticky-branding:not(.has-branding):not(.navigation-stick) .navigation-branding{display:none}.nav-aligned-center .navigation-branding,.nav-aligned-left .navigation-branding{margin-right:10px}.nav-aligned-center .main-navigation.has-branding .inside-navigation,.nav-aligned-center .main-navigation.has-sticky-branding.navigation-stick .inside-navigation{justify-content:center}.nav-aligned-left .main-navigation.has-branding:not(.slideout-navigation) .inside-navigation .main-nav,.nav-aligned-left .main-navigation.has-sticky-branding.navigation-stick .inside-navigation .main-nav{flex-grow:1}
|
||||
@@ -0,0 +1,362 @@
|
||||
/* offside-js 1.3.1 22-05-2016
|
||||
* Minimal JavaScript kit without library dependencies to push things off-canvas using just class manipulation
|
||||
* https://github.com/toomuchdesign/offside.git
|
||||
*
|
||||
* by Andrea Carraro
|
||||
* Available under the MIT license
|
||||
*/
|
||||
|
||||
/* Off-canvas element CSS */
|
||||
.main-navigation.offside {
|
||||
position: fixed; /* Does not play well with some old browsers (see: README) */
|
||||
width: var(--gp-slideout-width);
|
||||
height: 100%;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
z-index: 9999;
|
||||
overflow: auto;
|
||||
-webkit-overflow-scrolling: touch; /* enables momentum scrolling in iOS overflow elements */
|
||||
}
|
||||
|
||||
/* Left off-canvas elements default status: out of the page */
|
||||
.offside,
|
||||
.offside--left {
|
||||
left: calc(var(--gp-slideout-width) * -1);
|
||||
}
|
||||
|
||||
/* Right off-canvas elements default status: out of the page */
|
||||
.offside--right {
|
||||
left: auto;
|
||||
right: calc(var(--gp-slideout-width) * -1);
|
||||
}
|
||||
|
||||
/*
|
||||
* Left off-canvas element is open:
|
||||
* - off-canvas element slides in
|
||||
* - container elements slides out
|
||||
*/
|
||||
.offside--left.is-open:not(.slideout-transition),
|
||||
.offside-js--is-left .offside-sliding-element {
|
||||
transform: translate3d(var(--gp-slideout-width), 0, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Right off-canvas element is open:
|
||||
* - off-canvas element slides in
|
||||
* - container elements slides out
|
||||
*/
|
||||
.offside--right.is-open:not(.slideout-transition),
|
||||
.offside-js--is-right .offside-sliding-element {
|
||||
transform: translate3d(calc(var(--gp-slideout-width) * -1), 0, 0);
|
||||
}
|
||||
|
||||
/* Elements Transitions */
|
||||
.offside-js--interact .offside,
|
||||
.offside-js--interact .offside-sliding-element {
|
||||
transition: transform .2s cubic-bezier(.16, .68, .43, .99);
|
||||
|
||||
/* improves performance issues on mobile*/
|
||||
-webkit-backface-visibility: hidden;
|
||||
-webkit-perspective: 1000;
|
||||
}
|
||||
|
||||
/* Body overflow */
|
||||
.offside-js--init {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* GP */
|
||||
.slideout-navigation.main-navigation:not(.is-open):not(.slideout-transition) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.slideout-navigation.main-navigation:not(.slideout-transition).do-overlay {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slideout-navigation.main-navigation.slideout-transition.do-overlay {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.slideout-overlay {
|
||||
z-index: 100000;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
height: 100vh;
|
||||
min-height: 100%; /* Safari */
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: rgba(0,0,0,0.8);
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
transition: visibility .2s ease, opacity .2s ease;
|
||||
}
|
||||
|
||||
.offside-js--is-open .slideout-overlay {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slideout-overlay button.slideout-exit {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
background-color: transparent;
|
||||
color: #fff;
|
||||
font-size: 30px;
|
||||
border: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.slide-opened .slideout-overlay button.slideout-exit {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
button.slideout-exit:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.slideout-navigation button.slideout-exit {
|
||||
background: transparent;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
box-sizing: border-box;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.slide-opened nav.toggled .menu-toggle:before {
|
||||
content: "\f0c9";
|
||||
}
|
||||
|
||||
.offside-js--is-left.slide-opened .slideout-overlay button.slideout-exit {
|
||||
left: calc(var(--gp-slideout-width) - 5px);
|
||||
}
|
||||
|
||||
.offside-js--is-right.slide-opened .slideout-overlay button.slideout-exit {
|
||||
right: calc(var(--gp-slideout-width) - 5px);
|
||||
}
|
||||
|
||||
.slideout-widget {
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.slideout-navigation .main-nav,
|
||||
.slideout-navigation .slideout-widget:not(:last-child) {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.slideout-navigation:not(.do-overlay) .main-nav {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.slideout-navigation .mega-menu > ul > li {
|
||||
display: block;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.slideout-navigation .slideout-menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#generate-slideout-menu {
|
||||
z-index: 100001;
|
||||
}
|
||||
|
||||
#generate-slideout-menu .slideout-menu li{
|
||||
float: none;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.slideout-navigation .slideout-widget li {
|
||||
float: none;
|
||||
}
|
||||
|
||||
#generate-slideout-menu.do-overlay li {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#generate-slideout-menu.main-navigation ul ul {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#generate-slideout-menu.main-navigation ul ul.toggled-on {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
#generate-slideout-menu .slideout-menu li:hover > ul,
|
||||
#generate-slideout-menu .slideout-menu li.sfHover > ul {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#generate-slideout-menu.main-navigation .main-nav ul ul {
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.slideout-toggle:not(.has-svg-icon) a:before {
|
||||
content: "\f0c9";
|
||||
font-family: 'GP Premium';
|
||||
line-height: 1em;
|
||||
width: 1.28571429em;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.slide-opened .slideout-exit:not(.has-svg-icon):before,
|
||||
.slideout-navigation button.slideout-exit:not(.has-svg-icon):before {
|
||||
content: "\f00d";
|
||||
font-family: 'GP Premium';
|
||||
line-height: 1em;
|
||||
width: 1.28571429em;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#generate-slideout-menu li.menu-item-float-right {
|
||||
float: none !important;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.rtl .slideout-navigation {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.slideout-navigation .menu-item-has-children .dropdown-menu-toggle {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.slideout-navigation .slideout-widget .menu li {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.slideout-navigation .slideout-widget ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Overlay */
|
||||
|
||||
.slideout-navigation.do-overlay {
|
||||
transform: none !important;
|
||||
transition: opacity 0.2s, visibility 0.2s;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay .inside-navigation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 10% 10% 0;
|
||||
max-width: 700px;
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay .inside-navigation .main-nav,
|
||||
.slideout-navigation.do-overlay .inside-navigation .slideout-widget {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay .slideout-exit {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: auto;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay .slideout-menu li a {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay .slideout-menu li {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
#generate-slideout-menu.do-overlay .slideout-menu li,
|
||||
.slideout-navigation.do-overlay .inside-navigation {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay .menu-item-has-children .dropdown-menu-toggle {
|
||||
border-left: 1px solid rgba(0,0,0,0.07);
|
||||
padding: 0 10px;
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay ul ul {
|
||||
box-shadow: 0 0 0;
|
||||
}
|
||||
|
||||
.nav-aligned-right .slideout-navigation,
|
||||
.nav-aligned-center .slideout-navigation {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.slideout-navigation .sfHover > a > .dropdown-menu-toggle > .gp-icon svg {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.slideout-navigation .sub-menu .dropdown-menu-toggle .gp-icon svg {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
.slideout-mobile .main-navigation.toggled .main-nav > ul,
|
||||
.slideout-both .main-navigation.toggled .main-nav > ul,
|
||||
.slideout-desktop .main-navigation.toggled .main-nav li.slideout-toggle {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.slideout-mobile .has-inline-mobile-toggle #site-navigation.toggled,
|
||||
.slideout-both .has-inline-mobile-toggle #site-navigation.toggled {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.sf-menu > li.slideout-toggle {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.gen-sidebar-nav .sf-menu > li.slideout-toggle {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.off-canvas-toggle-label {
|
||||
padding-left: 7px;
|
||||
}
|
||||
|
||||
.gp-icon + .off-canvas-toggle-label {
|
||||
padding-left: 9px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.slideout-overlay button.slideout-exit {
|
||||
font-size: 20px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.slideout-overlay {
|
||||
top: -100px;
|
||||
height: calc(100% + 100px);
|
||||
height: calc(100vh + 100px);
|
||||
min-height: calc(100% + 100px); /* Safari */
|
||||
}
|
||||
|
||||
.slideout-navigation.do-overlay .slideout-exit {
|
||||
position: static;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
.main-navigation.offside{position:fixed;width:var(--gp-slideout-width);height:100%;height:100vh;top:0;z-index:9999;overflow:auto;-webkit-overflow-scrolling:touch}.offside,.offside--left{left:calc(var(--gp-slideout-width) * -1)}.offside--right{left:auto;right:calc(var(--gp-slideout-width) * -1)}.offside--left.is-open:not(.slideout-transition),.offside-js--is-left .offside-sliding-element{transform:translate3d(var(--gp-slideout-width),0,0)}.offside--right.is-open:not(.slideout-transition),.offside-js--is-right .offside-sliding-element{transform:translate3d(calc(var(--gp-slideout-width) * -1),0,0)}.offside-js--interact .offside,.offside-js--interact .offside-sliding-element{transition:transform .2s cubic-bezier(.16,.68,.43,.99);-webkit-backface-visibility:hidden;-webkit-perspective:1000}.offside-js--init{overflow-x:hidden}.slideout-navigation.main-navigation:not(.is-open):not(.slideout-transition){display:none}.slideout-navigation.main-navigation:not(.slideout-transition).do-overlay{opacity:1}.slideout-navigation.main-navigation.slideout-transition.do-overlay{opacity:0}.slideout-overlay{z-index:100000;position:fixed;width:100%;height:100%;height:100vh;min-height:100%;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,.8);visibility:hidden;opacity:0;cursor:pointer;transition:visibility .2s ease,opacity .2s ease}.offside-js--is-open .slideout-overlay{visibility:visible;opacity:1}.slideout-overlay button.slideout-exit{position:fixed;top:0;background-color:transparent;color:#fff;font-size:30px;border:0;opacity:0}.slide-opened .slideout-overlay button.slideout-exit{opacity:1}button.slideout-exit:hover{background-color:transparent}.slideout-navigation button.slideout-exit{background:0 0;width:100%;text-align:left;padding-top:20px;padding-bottom:20px;box-sizing:border-box;border:0}.slide-opened nav.toggled .menu-toggle:before{content:"\f0c9"}.offside-js--is-left.slide-opened .slideout-overlay button.slideout-exit{left:calc(var(--gp-slideout-width) - 5px)}.offside-js--is-right.slide-opened .slideout-overlay button.slideout-exit{right:calc(var(--gp-slideout-width) - 5px)}.slideout-widget{margin:20px}.slideout-navigation .main-nav,.slideout-navigation .slideout-widget:not(:last-child){margin-bottom:40px}.slideout-navigation:not(.do-overlay) .main-nav{width:100%;box-sizing:border-box}.slideout-navigation .mega-menu>ul>li{display:block;width:100%!important}.slideout-navigation .slideout-menu{display:block}#generate-slideout-menu{z-index:100001}#generate-slideout-menu .slideout-menu li{float:none;width:100%;clear:both;text-align:left}.slideout-navigation .slideout-widget li{float:none}#generate-slideout-menu.do-overlay li{text-align:center}#generate-slideout-menu.main-navigation ul ul{display:none}#generate-slideout-menu.main-navigation ul ul.toggled-on{display:block!important}#generate-slideout-menu .slideout-menu li.sfHover>ul,#generate-slideout-menu .slideout-menu li:hover>ul{display:none}#generate-slideout-menu.main-navigation .main-nav ul ul{position:relative;top:0;left:0;width:100%}.slideout-toggle:not(.has-svg-icon) a:before{content:"\f0c9";font-family:'GP Premium';line-height:1em;width:1.28571429em;text-align:center;display:inline-block;position:relative;top:1px}.slide-opened .slideout-exit:not(.has-svg-icon):before,.slideout-navigation button.slideout-exit:not(.has-svg-icon):before{content:"\f00d";font-family:'GP Premium';line-height:1em;width:1.28571429em;text-align:center;display:inline-block}#generate-slideout-menu li.menu-item-float-right{float:none!important;display:inline-block;width:auto}.rtl .slideout-navigation{position:fixed}.slideout-navigation .menu-item-has-children .dropdown-menu-toggle{float:right}.slideout-navigation .slideout-widget .menu li{float:none}.slideout-navigation .slideout-widget ul{display:block}.slideout-navigation.do-overlay{transform:none!important;transition:opacity .2s,visibility .2s;width:100%;text-align:center;left:0;right:0}.slideout-navigation.do-overlay .inside-navigation{display:flex;flex-direction:column;padding:10% 10% 0;max-width:700px}.slideout-navigation.do-overlay .inside-navigation .main-nav,.slideout-navigation.do-overlay .inside-navigation .slideout-widget{margin-left:auto;margin-right:auto;min-width:250px}.slideout-navigation.do-overlay .slideout-exit{position:fixed;right:0;top:0;width:auto;font-size:25px}.slideout-navigation.do-overlay .slideout-menu li a{display:inline-block}.slideout-navigation.do-overlay .slideout-menu li{margin-bottom:5px}#generate-slideout-menu.do-overlay .slideout-menu li,.slideout-navigation.do-overlay .inside-navigation{text-align:center}.slideout-navigation.do-overlay .menu-item-has-children .dropdown-menu-toggle{border-left:1px solid rgba(0,0,0,.07);padding:0 10px;margin:0 0 0 10px}.slideout-navigation.do-overlay ul ul{box-shadow:0 0 0}.nav-aligned-center .slideout-navigation,.nav-aligned-right .slideout-navigation{text-align:left}.slideout-navigation .sfHover>a>.dropdown-menu-toggle>.gp-icon svg{transform:rotate(180deg)}.slideoutLine truncated
|
||||
@@ -0,0 +1,76 @@
|
||||
.sticky-enabled .gen-sidebar-nav.is_stuck .main-navigation {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.sticky-enabled .gen-sidebar-nav.is_stuck {
|
||||
z-index: 500;
|
||||
}
|
||||
|
||||
.sticky-enabled .main-navigation.is_stuck {
|
||||
box-shadow: 0 2px 2px -2px rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.sticky-enabled .fixfixed .is_stuck {
|
||||
position: relative !important;
|
||||
}
|
||||
|
||||
.navigation-stick:not(.gen-sidebar-nav) {
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.both-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav,
|
||||
.mobile-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.both-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav > ul,
|
||||
.mobile-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav > ul,
|
||||
.mobile-header-sticky #mobile-header.toggled .main-nav > ul {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
#sticky-placeholder.mobile-header-navigation .mobile-header-logo,
|
||||
#sticky-placeholder .navigation-branding {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu > li {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu > li.slideout-toggle,
|
||||
.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu > li.search-item,
|
||||
.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu > li.wc-menu-item {
|
||||
display: block;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.nav-float-right .is_stuck.main-navigation:not(.toggled) ul {
|
||||
letter-spacing: -0.31em;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.nav-float-right .is_stuck.main-navigation:not(.toggled) ul li {
|
||||
letter-spacing: normal;
|
||||
}
|
||||
|
||||
.nav-float-right .is_stuck.main-navigation:not(.toggled) {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.nav-float-right .is_stuck.main-navigation.has-branding:not(.toggled) ul,
|
||||
.nav-float-right .is_stuck.main-navigation.has-sticky-branding:not(.toggled) ul {
|
||||
letter-spacing: unset;
|
||||
}
|
||||
|
||||
.nav-float-right .is_stuck.main-navigation.has-branding:not(.toggled) .menu > li,
|
||||
.nav-float-right .is_stuck.main-navigation.has-sticky-branding:not(.toggled) .menu > li {
|
||||
display: block;
|
||||
float: left;
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
.sticky-enabled .gen-sidebar-nav.is_stuck .main-navigation{margin-bottom:0}.sticky-enabled .gen-sidebar-nav.is_stuck{z-index:500}.sticky-enabled .main-navigation.is_stuck{box-shadow:0 2px 2px -2px rgba(0,0,0,.2)}.sticky-enabled .fixfixed .is_stuck{position:relative!important}.navigation-stick:not(.gen-sidebar-nav){left:0;right:0;width:100%!important}.both-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav,.mobile-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav{clear:both}.both-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav>ul,.mobile-header-sticky #mobile-header.toggled .main-nav>ul,.mobile-sticky-menu .main-navigation:not(#mobile-header).toggled .main-nav>ul{position:absolute;left:0;right:0;z-index:999}#sticky-placeholder .navigation-branding,#sticky-placeholder.mobile-header-navigation .mobile-header-logo{display:none}.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu>li{float:none;display:inline-block}.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu>li.search-item,.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu>li.slideout-toggle,.nav-float-right .is_stuck.main-navigation:not(.toggled) .menu>li.wc-menu-item{display:block;float:right}.nav-float-right .is_stuck.main-navigation:not(.toggled) ul{letter-spacing:-.31em;font-size:1em}.nav-float-right .is_stuck.main-navigation:not(.toggled) ul li{letter-spacing:normal}.nav-float-right .is_stuck.main-navigation:not(.toggled){text-align:right}.nav-float-right .is_stuck.main-navigation.has-branding:not(.toggled) ul,.nav-float-right .is_stuck.main-navigation.has-sticky-branding:not(.toggled) ul{letter-spacing:unset}.nav-float-right .is_stuck.main-navigation.has-branding:not(.toggled) .menu>li,.nav-float-right .is_stuck.main-navigation.has-sticky-branding:not(.toggled) .menu>li{display:block;float:left}
|
||||
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,646 @@
|
||||
/* offside-js 1.3.1 22-05-2016
|
||||
* Minimal JavaScript kit without library dependencies to push things off-canvas using just class manipulation
|
||||
* https://github.com/toomuchdesign/offside.git
|
||||
*
|
||||
* by Andrea Carraro
|
||||
* Available under the MIT license
|
||||
*/
|
||||
|
||||
;(function ( window, document, undefined ) {
|
||||
|
||||
/*
|
||||
* The first time Offside is called, it creates a singleton-factory object
|
||||
* and place it into "window.offside.factory".
|
||||
*
|
||||
* Offside factory serves the following purposes:
|
||||
* - DOM initialization
|
||||
* - Centralized Offside instances management and initialization
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
// Self-invoking function returning the object which contains
|
||||
// the "getInstance" method used for initializing
|
||||
// the Offside sigleton factory
|
||||
var offside = (function () {
|
||||
|
||||
// Global Offside singleton-factory constructor
|
||||
function initOffsideFactory( options ) {
|
||||
|
||||
// Utility functions
|
||||
// Shared among factory and Offside instances, too
|
||||
|
||||
// Close all open Offsides.
|
||||
// If an Offside instance id is provided, it just closes the matching instance instead
|
||||
var closeAll = function( offsideId ) {
|
||||
|
||||
// Look for an open Offside id
|
||||
if ( openOffsidesId.length > 0 ) {
|
||||
|
||||
// Close matching Offside instance if an ID is provided
|
||||
if ( !isNaN( offsideId ) ) {
|
||||
|
||||
instantiatedOffsides[ offsideId ].close();
|
||||
} else {
|
||||
|
||||
// Close all Offside instances
|
||||
openOffsidesId.forEach( function( offsideId ) {
|
||||
instantiatedOffsides[ offsideId ].close();
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
// Append a class to body in order to turn on elements CSS 3D transitions
|
||||
// only when happens the first interation with an Offside instance.
|
||||
// Otherwise we would see Offside instances being smoothly pushed
|
||||
// out of the screen during DOM initialization.
|
||||
turnOnCssTransitions = function() {
|
||||
addClass( body, transitionsClass );
|
||||
},
|
||||
|
||||
addClass = function( el, c ) {
|
||||
if ( el.classList ) {
|
||||
el.classList.add(c);
|
||||
} else {
|
||||
el.className = ( el.className + ' ' + c ).trim();
|
||||
}
|
||||
},
|
||||
|
||||
removeClass = function( el, c ) {
|
||||
if ( el.classList ) {
|
||||
el.classList.remove(c);
|
||||
} else {
|
||||
el.className = el.className.replace( new RegExp( '(^|\\b)' + c.split(' ').join('|') + '(\\b|$)', 'gi' ), ' ' );
|
||||
}
|
||||
},
|
||||
|
||||
addEvent = function( el, eventName, eventHandler ) {
|
||||
el.addEventListener( eventName, eventHandler );
|
||||
},
|
||||
|
||||
removeEvent = function( el, eventName, eventHandler ) {
|
||||
el.removeEventListener( eventName, eventHandler );
|
||||
},
|
||||
|
||||
// Return a collection (array) of DOM elements from:
|
||||
// - A DOM element
|
||||
// - An array of DOM elements
|
||||
// - A string selector
|
||||
getDomElements = function( els ) {
|
||||
|
||||
// "els" is a DOM element
|
||||
// http://stackoverflow.com/a/120275/2902821
|
||||
if( els instanceof HTMLElement ){
|
||||
return [ els ];
|
||||
}
|
||||
|
||||
// "els" is an array
|
||||
else if( Array.isArray( els ) ) {
|
||||
return els;
|
||||
}
|
||||
|
||||
// "els" is a string
|
||||
else if( typeof els === 'string' ) {
|
||||
// Convert Nodelist into an array
|
||||
// http://www.jstips.co/en/converting-a-node-list-to-an-array/
|
||||
return Array.apply( null, document.querySelectorAll( els ) );
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
// Check if a value exists in an array. Returns:
|
||||
// - array index if value exists
|
||||
// - "false" if value is not found
|
||||
// See: http://stackoverflow.com/a/5767357
|
||||
isInArray = function( arr, value ) {
|
||||
var index = arr.indexOf( value );
|
||||
return index > -1 ? index : false;
|
||||
};
|
||||
|
||||
// Offside.js factory initialization
|
||||
|
||||
var i,
|
||||
factorySettings; // Offside factory private settings
|
||||
|
||||
// Default factory settings
|
||||
factorySettings = {
|
||||
|
||||
slidingElementsSelector: '.offside-sliding-element', // String: Default sliding elements selectors ('#foo, #bar')
|
||||
disableCss3dTransforms: false, // Disable CSS 3d Transforms support (for testing purposes)
|
||||
debug: false, // Boolean: If true, print errors in console
|
||||
};
|
||||
|
||||
// User defined factory settings
|
||||
for ( i in options ) {
|
||||
if ( factorySettings.hasOwnProperty( i ) ) {
|
||||
factorySettings[i] = options[i];
|
||||
}
|
||||
}
|
||||
|
||||
// Private factory properties
|
||||
var globalClass = 'offside-js', // Global Offside classes namespace
|
||||
initClass = globalClass + '--init', // Class appended to body when Offside is intialized
|
||||
slidingElementsClass = 'offside-sliding-element', // Class appended to sliding elements
|
||||
transitionsClass = globalClass + '--interact', // Class appended to body when ready to turn on Offside CSS transitions (Added when first menu interaction happens)
|
||||
instantiatedOffsides = [], // Array containing all instantiated offside elements
|
||||
firstInteraction = true, // Keep track of first Offside interaction
|
||||
has3d = factorySettings.disableCss3dTransforms ? false : _has3d(), // Browser supports CSS 3d Transforms
|
||||
openOffsidesId = [], // Tracks opened Offside instances id's
|
||||
body = document.body,
|
||||
slidingElements = getDomElements( factorySettings.slidingElementsSelector ), // Sliding elements
|
||||
debug = factorySettings.debug;
|
||||
|
||||
// Offside singleton-factory Dom initialization
|
||||
// It's called just once on Offside singleton-factory init.
|
||||
function _factoryDomInit() {
|
||||
|
||||
// Add class to sliding elements
|
||||
slidingElements.forEach( function( item ) {
|
||||
addClass( item, slidingElementsClass );
|
||||
});
|
||||
|
||||
// DOM Fallbacks when CSS transform 3d not available
|
||||
if ( !has3d ) {
|
||||
// No CSS 3d Transform fallback
|
||||
addClass( document.documentElement, 'no-csstransforms3d' ); //Adds Modernizr-like class to HTML element when CSS 3D Transforms not available
|
||||
}
|
||||
|
||||
// Add init class to body
|
||||
addClass( body, initClass );
|
||||
}
|
||||
|
||||
// Private Offside factory methods
|
||||
|
||||
// Testing for CSS 3D Transform Support
|
||||
// https://gist.github.com/lorenzopolidori/3794226
|
||||
function _has3d() {
|
||||
|
||||
if ( !window.getComputedStyle ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var el = document.createElement('p'),
|
||||
has3d,
|
||||
transforms = {
|
||||
'webkitTransform':'-webkit-transform',
|
||||
'OTransform':'-o-transform',
|
||||
'msTransform':'-ms-transform',
|
||||
'MozTransform':'-moz-transform',
|
||||
'transform':'transform'
|
||||
};
|
||||
|
||||
// Add it to the body to get the computed style
|
||||
document.body.insertBefore(el, null);
|
||||
|
||||
for( var t in transforms ){
|
||||
if( el.style[t] !== undefined ){
|
||||
el.style[t] = 'translate3d(1px,1px,1px)';
|
||||
has3d = window.getComputedStyle(el).getPropertyValue(transforms[t]);
|
||||
}
|
||||
}
|
||||
|
||||
document.body.removeChild(el);
|
||||
|
||||
return ( has3d !== undefined && has3d.length > 0 && has3d !== 'none' );
|
||||
}
|
||||
|
||||
// Offside constructor wrapper
|
||||
// It supplies a wrapper around OffsideInstance constructor
|
||||
// to prevent instance initialization when casted on a non-existing DOM element
|
||||
// See: http://stackoverflow.com/a/8618792
|
||||
function createOffsideInstance( el, options, offsideId ) {
|
||||
|
||||
// Check if provided element exists before using it to instantiate an Offside instance
|
||||
var domEl = el !== undefined ?
|
||||
getDomElements( el ) :
|
||||
getDomElements( '.offside' );
|
||||
|
||||
// If provided el exists initialize an Offside instance, else return null
|
||||
return domEl !== false ?
|
||||
new OffsideInstance( domEl[0], options, offsideId ) :
|
||||
null;
|
||||
}
|
||||
|
||||
// Offside constructor
|
||||
// Set up and initialize a new Offside instance
|
||||
// Called by Offside factory "getOffsideInstance()" method
|
||||
function OffsideInstance( domEl, options, offsideId ) {
|
||||
|
||||
var i,
|
||||
offsideSettings;
|
||||
|
||||
// Default Offside instance settings
|
||||
offsideSettings = {
|
||||
|
||||
buttonsSelector: '', // String: Offside toggle buttons selectors ('#foo, #bar')
|
||||
slidingSide: 'left', // String: Offside element pushed on left or right
|
||||
init: function(){}, // Function: After init callback
|
||||
beforeOpen: function(){}, // Function: Before open callback
|
||||
afterOpen: function(){}, // Function: After open callback
|
||||
beforeClose: function(){}, // Function: Before close callback
|
||||
afterClose: function(){}, // Function: After close callback
|
||||
beforeDestroy: function(){}, // Function: After destroy callback
|
||||
afterDestroy: function(){}, // Function: After destroy callback
|
||||
};
|
||||
|
||||
// User defined Offside instance settings
|
||||
for ( i in options ) {
|
||||
if ( offsideSettings.hasOwnProperty( i ) ) {
|
||||
offsideSettings[i] = options[i];
|
||||
}
|
||||
}
|
||||
|
||||
// Offside instance private properties
|
||||
var offside = domEl, // Hello, I'm the Offside instance
|
||||
offsideButtons = getDomElements( offsideSettings.buttonsSelector ), // Offside toggle buttons
|
||||
slidingSide = offsideSettings.slidingSide,
|
||||
offsideClass = 'offside', // Class added to Offside instance when initialized
|
||||
offsideSideClass = offsideClass + '--' + slidingSide, // Class added to Offside instance when initialized (eg. offside offside--left)
|
||||
offsideOpenClass = 'is-open', // Class appended to Offside instance when open
|
||||
offsideBodyOpenClass = globalClass + '--' + 'is-open', // Class appended to body when an Offside instance is open (offside-js--is-open)
|
||||
offsideBodyOpenSideClass = globalClass + '--is-' + slidingSide, // Class appended to body when Offside instance is open (eg. offside-js--is-left / offside-js--is-open)
|
||||
id = offsideId || 0; // Offside instance id
|
||||
|
||||
// Offside instance private methods
|
||||
|
||||
var _toggleOffside = function() {
|
||||
|
||||
// Premise: Just 1 Offside instance at time can be open.
|
||||
|
||||
// Check currently toggling Offside status
|
||||
isInArray( openOffsidesId, id ) === false ? _openOffside() : _closeOffside();
|
||||
},
|
||||
|
||||
_openOffside = function() {
|
||||
|
||||
// beforeOpen callback
|
||||
offsideSettings.beforeOpen();
|
||||
|
||||
// Turn on CSS transitions on first interaction with an Offside instance
|
||||
if ( firstInteraction ) {
|
||||
firstInteraction = false;
|
||||
turnOnCssTransitions();
|
||||
}
|
||||
|
||||
// If another Offside instance is already open,
|
||||
// close it before going on
|
||||
closeAll();
|
||||
|
||||
// Set global body active class for current Offside instance
|
||||
addClass( body, offsideBodyOpenClass );
|
||||
addClass( body, offsideBodyOpenSideClass );
|
||||
|
||||
// Add Offside instance open class
|
||||
addClass( offside, offsideOpenClass );
|
||||
|
||||
// Update open Offside instances tracker
|
||||
openOffsidesId.push( id );
|
||||
|
||||
// afterOpen callback
|
||||
offsideSettings.afterOpen();
|
||||
},
|
||||
|
||||
_closeOffside = function() {
|
||||
|
||||
// Proceed with closing stuff only if
|
||||
// current Offside instance is listed among openOffsidesId array
|
||||
var index = isInArray( openOffsidesId, id );
|
||||
|
||||
if ( index !== false ) {
|
||||
|
||||
// beforeClose callback
|
||||
offsideSettings.beforeClose();
|
||||
|
||||
// Remove global body active class for current Offside instance
|
||||
removeClass( body, offsideBodyOpenClass );
|
||||
removeClass( body, offsideBodyOpenSideClass );
|
||||
|
||||
// Remove Offside instance open class
|
||||
removeClass( offside, offsideOpenClass );
|
||||
|
||||
// Update open Offside instances tracker
|
||||
openOffsidesId.splice( index, 1 );
|
||||
|
||||
// afterClose callback
|
||||
offsideSettings.afterClose();
|
||||
}
|
||||
},
|
||||
|
||||
_closeAll = function() {
|
||||
|
||||
closeAll();
|
||||
},
|
||||
|
||||
// Offside buttons click handler
|
||||
_onButtonClick = function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
_toggleOffside();
|
||||
},
|
||||
|
||||
/*
|
||||
// Get Offside instance unique ID
|
||||
_getId = function() {
|
||||
return id;
|
||||
}
|
||||
*/
|
||||
|
||||
// Set up and initialize a new Offside instance
|
||||
_initOffside = function() {
|
||||
|
||||
if ( debug ) {
|
||||
_checkElements();
|
||||
}
|
||||
|
||||
// Append classes to Offside instance (.offside and .offside{slidingSide})
|
||||
addClass( offside, offsideClass );
|
||||
addClass( offside, offsideSideClass );
|
||||
|
||||
// Toggle Offside on click event
|
||||
offsideButtons.forEach( function( item ) {
|
||||
addEvent( item, 'click', _onButtonClick );
|
||||
});
|
||||
|
||||
// Init callback
|
||||
offsideSettings.init();
|
||||
},
|
||||
|
||||
_destroyOffside = function() {
|
||||
|
||||
// beforeDestroy callback
|
||||
offsideSettings.beforeDestroy();
|
||||
|
||||
// Close Offside intance before destroy
|
||||
_closeOffside();
|
||||
|
||||
// Remove click event from Offside buttons
|
||||
offsideButtons.forEach( function( item ) {
|
||||
removeEvent( item, 'click', _onButtonClick );
|
||||
});
|
||||
|
||||
// Remove classes appended on init phase
|
||||
removeClass( offside, offsideClass );
|
||||
removeClass( offside, offsideSideClass );
|
||||
|
||||
// Destroy Offside instance
|
||||
delete instantiatedOffsides[id];
|
||||
|
||||
// afterDestroy callback
|
||||
offsideSettings.afterDestroy();
|
||||
},
|
||||
|
||||
// Fire console errors if DOM elements are missing
|
||||
_checkElements = function() {
|
||||
|
||||
if ( !offside ) {
|
||||
console.error( 'Offside alert: "offside" selector could not match any element' );
|
||||
}
|
||||
|
||||
if ( !offsideButtons.length ) {
|
||||
console.error( 'Offside alert: "buttonsSelector" selector could not match any element' );
|
||||
}
|
||||
};
|
||||
|
||||
// Offside instances public methods
|
||||
this.toggle = function() {
|
||||
_toggleOffside();
|
||||
};
|
||||
|
||||
this.open = function() {
|
||||
_openOffside();
|
||||
};
|
||||
|
||||
this.close = function() {
|
||||
_closeOffside();
|
||||
};
|
||||
|
||||
this.closeAll = function() {
|
||||
_closeAll();
|
||||
};
|
||||
|
||||
this.destroy = function() {
|
||||
_destroyOffside();
|
||||
};
|
||||
|
||||
// Ok, init Offside instance
|
||||
_initOffside();
|
||||
|
||||
} // OffsideInstance constructor end
|
||||
|
||||
|
||||
// DOM initialization
|
||||
_factoryDomInit();
|
||||
|
||||
// This is the actual returned Offside factory
|
||||
return {
|
||||
|
||||
//Offside factory public methods
|
||||
closeOpenOffside: function() {
|
||||
closeAll();
|
||||
},
|
||||
|
||||
// This is the method responsible for creating a new Offside instance
|
||||
// and register it into "instantiatedOffsides" array
|
||||
getOffsideInstance: function( el, options ) {
|
||||
|
||||
// Get length of instantiated Offsides array
|
||||
var offsideId = instantiatedOffsides.length || 0,
|
||||
|
||||
// Instantiate new Offside instance
|
||||
offsideInstance = createOffsideInstance( el, options, offsideId );
|
||||
|
||||
// If Offside instance is sccessfully created
|
||||
if ( offsideInstance !== null ) {
|
||||
|
||||
// Push new instance into "instantiatedOffsides" array and return it
|
||||
|
||||
/*jshint -W093 */
|
||||
return instantiatedOffsides[ offsideId ] = offsideInstance;
|
||||
/*jshint +W093 */
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
} // initOffsideFactory() end
|
||||
|
||||
return {
|
||||
|
||||
// Get the Singleton instance if one exists
|
||||
// or create one if it doesn't
|
||||
getInstance: function ( el, options ) {
|
||||
|
||||
if ( !window.offside.factory ) {
|
||||
window.offside.factory = initOffsideFactory( options );
|
||||
}
|
||||
|
||||
return window.offside.factory.getOffsideInstance( el, options );
|
||||
}
|
||||
};
|
||||
|
||||
})();
|
||||
|
||||
// Store in window a reference to the Offside singleton factory
|
||||
if ( typeof module !== 'undefined' && module.exports ) {
|
||||
module.exports = offside.getInstance;
|
||||
} else {
|
||||
window.offside = offside.getInstance;
|
||||
}
|
||||
|
||||
})( window, document );
|
||||
|
||||
/**
|
||||
* Start GP.
|
||||
*/
|
||||
var generateOffside = offside( '.slideout-navigation', {
|
||||
slidingElementsSelector:'#slideout-container',
|
||||
buttonsSelector: '.slideout-mobile .main-navigation .menu-toggle, .slideout-both .main-navigation .menu-toggle, .slideout-both .slideout-toggle, .slideout-desktop .slideout-toggle',
|
||||
slidingSide: offSide.side,
|
||||
beforeOpen: function() {
|
||||
document.querySelector( '.slideout-navigation' ).classList.add( 'slideout-transition' );
|
||||
},
|
||||
afterOpen: function() {
|
||||
setTimeout( function() {
|
||||
document.querySelector( '.slideout-navigation' ).classList.remove( 'slideout-transition' );
|
||||
}, 10 );
|
||||
|
||||
document.documentElement.classList.add( 'slide-opened' );
|
||||
document.body.classList.add( 'slide-opened' );
|
||||
|
||||
if ( document.body.classList.contains( 'dropdown-hover' ) ) {
|
||||
var dropdownItems = document.querySelector( '.slideout-navigation' ).querySelectorAll( 'li.menu-item-has-children' );
|
||||
for ( var i = 0; i < dropdownItems.length; i++ ) {
|
||||
var spanToggle = dropdownItems[i].querySelector( 'span.dropdown-menu-toggle' );
|
||||
|
||||
if ( spanToggle ) {
|
||||
spanToggle.setAttribute( 'tabindex', 0 );
|
||||
spanToggle.setAttribute( 'role', 'button' );
|
||||
spanToggle.setAttribute( 'aria-expanded', true );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Focus the first focusable element.
|
||||
var focusable = document.querySelector( '.slideout-navigation' ).querySelectorAll( 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])' );
|
||||
|
||||
if ( focusable ) {
|
||||
setTimeout( function() {
|
||||
focusable[0].focus();
|
||||
}, 200 );
|
||||
}
|
||||
},
|
||||
beforeClose: function() {
|
||||
document.querySelector( '.slideout-navigation' ).classList.add( 'slideout-transition' );
|
||||
},
|
||||
afterClose: function() {
|
||||
setTimeout( function() {
|
||||
document.querySelector( '.slideout-navigation' ).classList.remove( 'slideout-transition' );
|
||||
}, 500 );
|
||||
|
||||
var body = document.body,
|
||||
nav = document.querySelectorAll( '.main-navigation' );
|
||||
|
||||
for ( var i = 0; i < nav.length; i++ ) {
|
||||
if ( nav[i].classList.contains( 'toggled' ) ) {
|
||||
nav[i].classList.remove( 'toggled' );
|
||||
}
|
||||
};
|
||||
|
||||
document.documentElement.classList.remove( 'slide-opened' );
|
||||
body.classList.remove( 'slide-opened' );
|
||||
|
||||
if ( 'true' === document.querySelector( '.main-navigation .menu-toggle' ).getAttribute( 'aria-expanded' ) ) {
|
||||
document.querySelector( '.main-navigation .menu-toggle' ).setAttribute( 'aria-expanded', false );
|
||||
}
|
||||
|
||||
if ( body.classList.contains( 'dropdown-hover' ) ) {
|
||||
var dropdownItems = document.querySelector( '.main-navigation:not(.slideout-navigation):not(.mobile-menu-control-wrapper)' ).querySelectorAll( 'li.menu-item-has-children' );
|
||||
for ( var i = 0; i < dropdownItems.length; i++ ) {
|
||||
var spanToggle = dropdownItems[i].querySelector( 'span.dropdown-menu-toggle' );
|
||||
|
||||
if ( spanToggle ) {
|
||||
spanToggle.removeAttribute( 'tabindex' );
|
||||
spanToggle.setAttribute( 'role', 'presentation' );
|
||||
spanToggle.removeAttribute( 'aria-expanded' );
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
} );
|
||||
|
||||
var closeElements = document.querySelectorAll( '.slideout-overlay, .slideout-exit, .slider-exit a' );
|
||||
for ( var i = 0; i < closeElements.length; i++ ) {
|
||||
closeElements[i].addEventListener( 'click', function( e ) {
|
||||
e.preventDefault();
|
||||
generateOffside.close();
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Closes the slideout navigation if the link does something.
|
||||
* eg. Goes to an anchor link
|
||||
*
|
||||
* @since 1.7
|
||||
*/
|
||||
var slideoutLinks = document.querySelectorAll( '.slideout-navigation ul a' );
|
||||
|
||||
var closeOffsideOnAction = function() {
|
||||
var url = this.getAttribute( 'href' );
|
||||
|
||||
if ( '#' !== url && '' !== url && ! navigator.userAgent.match( /iemobile/i ) ) {
|
||||
setTimeout( function() {
|
||||
generateOffside.close();
|
||||
}, 200 );
|
||||
}
|
||||
};
|
||||
|
||||
for ( var i = 0; i < slideoutLinks.length; i++ ) {
|
||||
slideoutLinks[i].addEventListener( 'click', closeOffsideOnAction, false );
|
||||
};
|
||||
|
||||
document.addEventListener( 'keyup', function( e ) {
|
||||
if ( document.body.classList.contains( 'slide-opened' ) ) {
|
||||
e = e || window.event;
|
||||
|
||||
if ( e.keyCode == 27 ) {
|
||||
generateOffside.close();
|
||||
|
||||
var body = document.body;
|
||||
|
||||
// Focus our slideout toggle.
|
||||
if ( window.document.documentElement.clientWidth <= 768 ) {
|
||||
if ( body.classList.contains( 'slideout-mobile' ) || body.classList.contains( 'slideout-both' ) ) {
|
||||
document.querySelectorAll( '.main-navigation:not(.slideout-navigation)' ).forEach( function( navigation ) {
|
||||
if ( navigation && navigation.style.display !== 'none' ) {
|
||||
navigation.querySelector( '.menu-toggle' ).focus();
|
||||
}
|
||||
} );
|
||||
}
|
||||
} else {
|
||||
if ( body.classList.contains( 'slideout-desktop' ) || body.classList.contains( 'slideout-both' ) ) {
|
||||
document.querySelectorAll( '.main-navigation:not(.slideout-navigation)' ).forEach( function( navigation ) {
|
||||
if ( navigation && navigation.style.display !== 'none' ) {
|
||||
navigation.querySelector( '.slideout-toggle a' ).focus();
|
||||
}
|
||||
} );
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
} );
|
||||
|
||||
var toggles = document.querySelectorAll( '.slideout-toggle a' );
|
||||
for ( var i = 0; i < toggles.length; i++ ) {
|
||||
toggles[ i ].addEventListener( 'keypress', function( e ) {
|
||||
if ( ' ' === e.key ) {
|
||||
e.preventDefault();
|
||||
generateOffside.open();
|
||||
}
|
||||
} );
|
||||
};
|
||||
@@ -0,0 +1 @@
|
||||
!function(a,c,u){"use strict";var e={getInstance:function(e,t){return a.offside.factory||(a.offside.factory=n(t)),a.offside.factory.getOffsideInstance(e,t)}};function n(e){var t,p=function(e){0<k.length&&(isNaN(e)?k.forEach(function(e){x[e].close()}):x[e].close())},b=function(){h(C,i)},h=function(e,t){e.classList?e.classList.add(t):e.className=(e.className+" "+t).trim()},S=function(e,t){e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp("(^|\\b)"+t.split(" ").join("|")+"(\\b|$)","gi")," ")},L=function(e,t,n){e.addEventListener(t,n)},A=function(e,t,n){e.removeEventListener(t,n)},E=function(e){return e instanceof HTMLElement?[e]:Array.isArray(e)?e:"string"==typeof e&&Array.apply(null,c.querySelectorAll(e))},O=function(e,t){e=e.indexOf(t);return-1<e&&e},n={slidingElementsSelector:".offside-sliding-element",disableCss3dTransforms:!1,debug:!1};for(t in e)n.hasOwnProperty(t)&&(n[t]=e[t]);var q="offside-js",o=q+"--init",i=q+"--interact",x=[],w=!0,s=!n.disableCss3dTransforms&&function(){if(!a.getComputedStyle)return!1;var e,t,n=c.createElement("p"),o={webkitTransform:"-webkit-transform",OTransform:"-o-transform",msTransform:"-ms-transform",MozTransform:"-moz-transform",transform:"transform"};for(t in c.body.insertBefore(n,null),o)n.style[t]!==u&&(n.style[t]="translate3d(1px,1px,1px)",e=a.getComputedStyle(n).getPropertyValue(o[t]));return c.body.removeChild(n),e!==u&&0<e.length&&"none"!==e}(),k=[],C=c.body,r=E(n.slidingElementsSelector),T=n.debug;function l(e,t,n){var o,i={buttonsSelector:"",slidingSide:"left",init:function(){},beforeOpen:function(){},afterOpen:function(){},beforeClose:function(){},afterClose:function(){},beforeDestroy:function(){},afterDestroy:function(){}};for(o in t)i.hasOwnProperty(o)&&(i[o]=t[o]);var s=e,r=E(i.buttonsSelector),e=i.slidingSide,l="offside",a=l+"--"+e,c="is-open",u=q+"--is-open",d=q+"--is-"+e,f=n||0,m=function(){(!1===O(k,f)?g:y)()},g=function(){i.beforeOpen(),w&&(w=!1,b()),p(),h(C,u),h(C,d),h(s,c),k.push(f),i.afterOpen()},y=function(){var e=O(k,f);!1!==e&&(i.beforeClose(),S(C,u),S(C,d),S(s,c),k.splice(e,1),i.afterClose())},v=function(e){e.preventDefault(),m()},e=function(){s||console.error('Offside alert: "offside" selector could not match any element'),r.length||console.error('Offside alert: "buttonsSelector" selector could not match any element')};this.toggle=function(){m()},this.open=function(){g()},this.close=function(){y()},this.closeAll=function(){p()},this.destroy=function(){i.beforeDestroy(),y(),r.forEach(function(e){A(e,"click",v)}),S(s,l),S(s,a),delete x[f],i.afterDestroy()},T&&e(),h(s,l),h(s,a),r.forEach(function(e){L(e,"click",v)}),i.init()}return r.forEach(function(e){h(e,"offside-sliding-element")}),s||h(c.documentElement,"no-csstransforms3d"),h(C,o),{closeOpenOffside:function(){p()},getOffsideInstance:function(e,t){var n,o=x.length||0,e=(t=t,n=o,!1!==(e=E((e=e)!==u?e:".offside"))?new l(e[0],t,n):null);if(null!==e)return x[o]=e}}}"undefined"!=typeof module&&module.exports?module.exports=e.getInstance:a.offside=e.getInstance}(window,document);for(var generateOffside=offside(".slideout-navigation",{slidingElementsSelector:"#slideout-container",buttonsSelector:".slideout-mobile .main-navigation .menu-toggle, .slideout-both .main-navigation .menu-toggle, .slideout-both .slideout-toggle, .slideout-desktop .slideout-toggle",slidingSide:offSide.side,beforeOpen:function(){document.querySelector(".slideout-navigation").classList.add("slideout-transition")},afterOpen:function(){if(setTimeout(function(){document.querySelector(".slideout-navigation").classList.remove("slideout-transition")},10),document.documentElement.classList.add("slide-opened"),document.body.classList.add("slide-opened"),document.body.classList.contains("dropdown-hover"))for(var e=document.querySelector(".slideout-navigation").querySelectorAll("li.menu-item-has-children"),t=0;t<e.length;t++){var n=e[t].querySelector("span.dropdown-menu-toggle");n&&(n.setAttribute("tabindex",0),n.setAttribute("role","button"),n.setAttribute("aria-expanded",!0))}var o=document.querySelector(".slideout-navigation").querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');o&&setTimeout(function(){o[0].focus()},200)},beforeClose:function(){document.querySelector(".slideout-navigation").classList.add("slideout-transition")},afterClose:function(){setTimeout(function(){document.querySelector(".slideout-navigation").classList.remove("slideout-transition")},500);for(var e=document.body,t=document.querySelectorAll(".main-navigation"),n=0;n<t.length;n++)t[n].classList.contains("toggled")&&t[n].classList.remove("toggled");if(document.documentElement.classList.remove("slide-opened"),e.classList.remove("slide-opened"),"true"===document.querySelector(".main-navigation .menu-toggle").getAttribute("aria-expanded")&&document.querySelector(".main-navigation .menu-toggle").setAttribute("aria-expanded",!1),e.classList.contains("dropdown-hover"))for(var o=document.querySelector(".mainLine truncated
|
||||
@@ -0,0 +1,650 @@
|
||||
(function ($, window, document) {
|
||||
var StickUp = function(elem, opts) {
|
||||
var lastScrollTop = 0,
|
||||
scroll = 0,
|
||||
scrollDir = '',
|
||||
scrollDistance = 0,
|
||||
active = false,
|
||||
bottom = false,
|
||||
hold = false,
|
||||
disabled = false,
|
||||
landscape = false,
|
||||
portrait = false,
|
||||
stickyHeight = 0,
|
||||
outerHeight = 0,
|
||||
currentOuterHeight = 0,
|
||||
viewportHeight = 0,
|
||||
scrollBottom = 0,
|
||||
elementOffset = 0,
|
||||
elementOffsetBottom = 0,
|
||||
$element = $(),
|
||||
$body = $( 'body' ),
|
||||
stickyDelay = 0,
|
||||
topMargin = 0,
|
||||
offset = 0,
|
||||
$placeholder = $( elem ).clone().css({
|
||||
'visibility': 'hidden',
|
||||
'display': 'none'
|
||||
}).attr({
|
||||
id: 'sticky-placeholder',
|
||||
'aria-hidden': true,
|
||||
itemtype: null,
|
||||
itemscope: null,
|
||||
}),
|
||||
$parent = $(),
|
||||
stickpoints = {
|
||||
top:0,
|
||||
bottom:0,
|
||||
custom:[]
|
||||
},
|
||||
left,
|
||||
|
||||
//defaults
|
||||
options = {
|
||||
scrollHide: false,
|
||||
lazyHeight: 0,
|
||||
topMargin: "auto",
|
||||
keepInWrapper: false,
|
||||
wrapperSelector: '',
|
||||
zIndex: 10000,
|
||||
namespaceClass: "stuckElement",
|
||||
fixedClass: "isStuck",
|
||||
disableOn:function(){
|
||||
return true;
|
||||
},
|
||||
transition: "none"
|
||||
},
|
||||
|
||||
getTopMargin = function() {
|
||||
var wpAdminBar = ( jQuery( '#wpadminbar' ).length > 0 && jQuery( '#wpadminbar' ).css( 'position' ) == 'fixed' ) ? jQuery( '#wpadminbar' ).outerHeight() : 0;
|
||||
if (options.topMargin === 'auto') {
|
||||
return parseInt( wpAdminBar + $element.css( 'marginTop' ) );
|
||||
} else {
|
||||
if ( isNaN( options.topMargin ) && options.topMargin.search( "px" ) > 0 ) {
|
||||
return parseInt( wpAdminBar + options.topMargin.replace( "px", "" ) );
|
||||
} else if ( ! isNaN( parseInt( options.topMargin ) ) ) {
|
||||
return parseInt( wpAdminBar + options.topMargin );
|
||||
} else {
|
||||
void 0;
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
unStick = function() {
|
||||
void 0;
|
||||
$placeholder.remove();
|
||||
|
||||
$element.removeClass(options.fixedClass)
|
||||
.css({
|
||||
'max-width': '',
|
||||
'margin-top': '',
|
||||
'margin-left': '',
|
||||
'margin-right': '',
|
||||
'position': '',
|
||||
'top': '',
|
||||
'left': '',
|
||||
'right': '',
|
||||
'bottom': '',
|
||||
'width': '',
|
||||
'opacity': '',
|
||||
'height': '',
|
||||
'overflow': '',
|
||||
'-webkit-transform': '',
|
||||
'-ms-transform': '',
|
||||
'transform': '',
|
||||
'-webkit-transition': '',
|
||||
'-ms-transition': '',
|
||||
'transition': '',
|
||||
'visibility': '',
|
||||
'z-index': '',
|
||||
})
|
||||
.removeClass( 'sticky-navigation-transition' )
|
||||
.removeClass( 'navigation-transition' )
|
||||
.removeClass( 'sticky-nav-scrolling-up' );
|
||||
|
||||
if ( 'sticky-navigation' === $element.attr( 'id' ) ) {
|
||||
$element.attr( 'id', 'site-navigation' );
|
||||
}
|
||||
|
||||
active = false;
|
||||
bottom = false;
|
||||
hold = false;
|
||||
|
||||
$element.trigger( 'stickUp:unStick' );
|
||||
},
|
||||
|
||||
holdIt = function( forceBottom ) {
|
||||
void 0;
|
||||
|
||||
$( $placeholder ).insertAfter( $element ).show().addClass( options.fixedClass );
|
||||
|
||||
var offsetParent = $placeholder.offsetParent();
|
||||
|
||||
if ( forceBottom ) {
|
||||
$element.css({
|
||||
position: "absolute"
|
||||
});
|
||||
|
||||
var topOffset =
|
||||
($parent.offset().top + $parent.outerHeight()) //bottom of container
|
||||
- offsetParent.offset().top - currentOuterHeight //parent-position - elementHeight
|
||||
- parseInt( $parent.css( "paddingBottom" ) );
|
||||
}
|
||||
void 0;
|
||||
void 0;
|
||||
$element.css({
|
||||
position: "absolute",
|
||||
marginTop: topMargin,
|
||||
bottom:"",
|
||||
left:$placeholder.position().left,
|
||||
top: forceBottom? topOffset : $element.offset().top - offsetParent.offset().top - topMargin
|
||||
});
|
||||
|
||||
$element.trigger( 'stickUp:holdIt' );
|
||||
},
|
||||
|
||||
stickIt = function() {
|
||||
void 0;
|
||||
active = true;
|
||||
|
||||
if ( options.zIndex ) {
|
||||
$element.css( 'z-index', options.zIndex );
|
||||
}
|
||||
|
||||
if ( 'fade' == options.transition ) {
|
||||
$element.hide();
|
||||
}
|
||||
|
||||
if ( 'slide' == options.transition || options.scrollHide ) {
|
||||
$element.css({
|
||||
'height': '0',
|
||||
'overflow': 'hidden',
|
||||
'visibility': 'hidden'
|
||||
});
|
||||
}
|
||||
|
||||
$( $placeholder ).insertAfter( $element ).show().addClass( options.fixedClass );
|
||||
|
||||
if ( $( '.gen-sidebar-nav' ).length ) {
|
||||
$placeholder.css( 'height', $element.outerHeight() );
|
||||
}
|
||||
|
||||
if ( 'left' == $element.css( 'float' ) || 'right' == $element.css( 'float' ) ) {
|
||||
$placeholder.css( 'float', $element.css( 'float' ) );
|
||||
$placeholder.attr( 'style', $placeholder.attr( 'style' ) + 'width:auto !important;' );
|
||||
}
|
||||
|
||||
if ( 'slide' == options.transition && 'block' == $placeholder.css( 'display' ) ) {
|
||||
$element.css({
|
||||
'-webkit-transform': 'translateY(-100%)',
|
||||
'-ms-transform': 'translateY(-100%)',
|
||||
'transform': 'translateY(-100%)',
|
||||
'-webkit-transition': 'transform 300ms ease-in-out',
|
||||
'-ms-transition': 'transform 300ms ease-in-out',
|
||||
'transition': 'transform 300ms ease-in-out'
|
||||
});
|
||||
}
|
||||
|
||||
$element.addClass(options.fixedClass);
|
||||
|
||||
if ( 'site-navigation' === $element.attr( 'id' ) ) {
|
||||
$element.attr( 'id', 'sticky-navigation' );
|
||||
}
|
||||
|
||||
var topDistance = -offset;
|
||||
|
||||
$element.css({
|
||||
'margin-top': topMargin,
|
||||
'position': 'fixed',
|
||||
'top': topDistance + 'px',
|
||||
'left': '',
|
||||
'right': '',
|
||||
'bottom': '',
|
||||
});
|
||||
|
||||
$element.trigger( 'stickUp:stickIt' );
|
||||
|
||||
if ( 'fade' == options.transition ) {
|
||||
$element.fadeIn( 300 );
|
||||
}
|
||||
|
||||
if ( 'slide' == options.transition ) {
|
||||
$element.one("webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend", function(event) {
|
||||
$element.css({
|
||||
'visibility': '',
|
||||
'height': '',
|
||||
'overflow': '',
|
||||
});
|
||||
|
||||
setTimeout( function() {
|
||||
$element.css({
|
||||
'-webkit-transform': 'translateY(0)',
|
||||
'-ms-transform': 'translateY(0)',
|
||||
'transform': 'translateY(0)',
|
||||
});
|
||||
}, 10 );
|
||||
});
|
||||
}
|
||||
|
||||
if ( options.scrollHide ) {
|
||||
$element.css({
|
||||
'height': '',
|
||||
'overflow': '',
|
||||
'visibility': ''
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
syncWidth = function() {
|
||||
if ( $placeholder && $placeholder.width() !== $element.outerWidth() ) {
|
||||
$element.outerWidth( $placeholder.outerWidth() );
|
||||
}
|
||||
},
|
||||
|
||||
stickUpScrollHandlerFn = function(event) {
|
||||
if ( ! options.disableOn() ) {
|
||||
if( !disabled ) {
|
||||
void 0;
|
||||
unStick();
|
||||
disabled = true;
|
||||
}
|
||||
return;
|
||||
} else if ( disabled ) {
|
||||
disabled = false;
|
||||
}
|
||||
|
||||
if ( options.keepInWrapper && ! $parent.is( ':visible' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
scroll = $( event.target ).scrollTop();
|
||||
scrollDir = ( scroll >= lastScrollTop ) ? 'down' : 'up';
|
||||
scrollDistance = Math.abs( lastScrollTop - scroll );
|
||||
viewportHeight = $( window ).outerHeight();
|
||||
scrollBottom = scroll + viewportHeight;
|
||||
lastScrollTop = scroll;
|
||||
elementOffset = $element.offset().top;
|
||||
stickyHeight = parseInt( $element.outerHeight() + topMargin ) + parseInt( $element.css( 'marginBottom' ) );
|
||||
|
||||
if ( ! active && ! hold && ! bottom ) {
|
||||
outerHeight = parseInt( $element.outerHeight( true ) );
|
||||
|
||||
if ( ! bottom && ! hold ) {
|
||||
stickpoints.top = parseInt($element.offset().top);
|
||||
} else {
|
||||
stickpoints.top = parseInt($placeholder.offset().top);
|
||||
left = parseInt($element.offset().left)+5;
|
||||
}
|
||||
}
|
||||
|
||||
currentOuterHeight = parseInt( $element.outerHeight() ) + parseInt( $element.css( 'margin-bottom' ) ) + topMargin;
|
||||
|
||||
if ( options.keepInWrapper ) {
|
||||
stickpoints.bottom = $parent.offset().top + $parent.outerHeight() - parseInt( $parent.css( 'paddingBottom' ) );
|
||||
} else {
|
||||
stickpoints.bottom = $( document ).outerHeight();
|
||||
}
|
||||
|
||||
elementOffsetBottom = $element.offset().top + currentOuterHeight;
|
||||
|
||||
// Google like reappearance on upward scroll
|
||||
if ( options.scrollHide ) {
|
||||
offset = stickyHeight + options.lazyHeight; //negative offset for initial hiding
|
||||
} else {
|
||||
offset = options.lazyHeight;
|
||||
}
|
||||
|
||||
if ( 'none' !== options.transition ) {
|
||||
stickyDelay = $element.outerHeight() * 2;
|
||||
}
|
||||
|
||||
// Update top margin on scroll
|
||||
topMargin = ( options.topMargin !== null ) ? getTopMargin() : 0;
|
||||
|
||||
// If our top margin changes (#wpadminbar), update our margin
|
||||
if ( active && topMargin !== $element.css( 'margin-top' ) ) {
|
||||
$element.css( 'margin-top', topMargin );
|
||||
}
|
||||
|
||||
if ( ! active && ! bottom && scroll >= stickpoints.top - topMargin + offset + stickyDelay
|
||||
|| bottom && hold && scroll <= elementOffset - topMargin + offset ) {
|
||||
void 0;
|
||||
stickIt();
|
||||
active = true;
|
||||
bottom = false;
|
||||
hold = false;
|
||||
}
|
||||
|
||||
if ( active && ! bottom && scroll >= stickpoints.top - topMargin + offset + ( $element.outerHeight() / 2 ) ) {
|
||||
$placeholder.addClass( 'sticky-navigation-transition' );
|
||||
$element.addClass( 'sticky-navigation-transition' );
|
||||
}
|
||||
|
||||
if ( options.keepInWrapper
|
||||
&& parseInt(elementOffsetBottom - topMargin ) !== parseInt( stickpoints.bottom )
|
||||
&& scroll >= stickpoints.bottom - currentOuterHeight + offset ) {
|
||||
void 0;
|
||||
holdIt( true );
|
||||
active = false;
|
||||
bottom = true;
|
||||
hold = true;
|
||||
}
|
||||
|
||||
//Calculate lazyHeight and autoHide
|
||||
if ( active ) {
|
||||
var topValue = parseInt( $element.css( 'top' ) );
|
||||
if ( scrollDir === 'up' && topValue !== 0 ) {
|
||||
var newTopValue = scrollDistance > -topValue ? 0 : topValue + scrollDistance;
|
||||
$element.css( 'top', newTopValue + 'px' );
|
||||
$element.addClass( 'sticky-nav-scrolling-up' );
|
||||
} else if ( scrollDir === "down" && topValue > -offset ) {
|
||||
var newTopValue = scrollDistance > offset + topValue ? -offset : topValue - scrollDistance;
|
||||
$element.css( 'top', newTopValue + 'px' );
|
||||
$element.removeClass( 'sticky-nav-scrolling-up' );
|
||||
}
|
||||
}
|
||||
|
||||
//UNSTICK
|
||||
if ( ( active || hold || bottom ) && scroll <= stickpoints.top - topMargin ) {
|
||||
void 0;
|
||||
unStick();
|
||||
}
|
||||
|
||||
//RESPONSIVE baby ;-)
|
||||
if ( active || hold || bottom ) {
|
||||
syncWidth();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
stickUpResponsiveHandlerFn = function( event ){
|
||||
if ( hold ) {
|
||||
holdIt();
|
||||
bottom = false;
|
||||
}
|
||||
|
||||
void 0;
|
||||
stickUpScrollHandlerFn( event );
|
||||
};
|
||||
|
||||
//init
|
||||
var initialize = function( elem, opts ) {
|
||||
$element = $( elem );
|
||||
|
||||
// adding a class to users div
|
||||
$element.addClass( options.namespaceClass );
|
||||
|
||||
//getting options
|
||||
if ( opts ) {
|
||||
$.extend( true, options, opts );
|
||||
}
|
||||
|
||||
topMargin = ( options.topMargin !== null ) ? getTopMargin() : 0;
|
||||
|
||||
if ( options.lazyHeight ) {
|
||||
topMargin = topMargin + options.lazyHeight;
|
||||
}
|
||||
|
||||
if ( options.keepInWrapper ) {
|
||||
if ( options.wrapperSelector !== '' ) {
|
||||
$parent = $element.closest( options.wrapperSelector );
|
||||
}
|
||||
|
||||
//if no Wrapper available use offsetParent
|
||||
if ( ! $parent.length ) {
|
||||
$parent = $element.parent();
|
||||
}
|
||||
} else {
|
||||
$parent = $body;
|
||||
}
|
||||
|
||||
$( window ).on( 'scroll.stickUp', stickUpScrollHandlerFn );
|
||||
$( window ).on( 'resize.stickUp', stickUpResponsiveHandlerFn );
|
||||
|
||||
//initial round ;-)
|
||||
stickUpScrollHandlerFn( {target: document} );
|
||||
|
||||
};
|
||||
|
||||
initialize.call( this, elem, opts );
|
||||
|
||||
$( elem ).on( 'stickUp:detach', function( opts ) {
|
||||
void 0;
|
||||
$element = $(this);
|
||||
$element.removeClass(options.namespaceClass);
|
||||
$placeholder.remove();
|
||||
$element.removeClass(options.fixedClass)
|
||||
.css({
|
||||
maxWidth:"",
|
||||
marginTop: "",
|
||||
marginLeft:"",
|
||||
marginRight:"",
|
||||
position: "",
|
||||
top: "",
|
||||
left: "",
|
||||
right: "",
|
||||
bottom: "",
|
||||
width:""
|
||||
});
|
||||
active = false;
|
||||
bottom = false;
|
||||
hold = false;
|
||||
disabled = true;
|
||||
$( window ).off( 'scroll.stickUp', stickUpScrollHandlerFn );
|
||||
$( window ).off( 'resize.stickUp', stickUpResponsiveHandlerFn );
|
||||
})
|
||||
};
|
||||
|
||||
$.fn.stickUp = function( options ) {
|
||||
return this.each(function() {
|
||||
new StickUp( this, options );
|
||||
});
|
||||
};
|
||||
|
||||
}(jQuery, window, document));
|
||||
|
||||
(function ( $ ) {
|
||||
$.fn.GenerateSimpleSticky = function( options ) {
|
||||
var settings = $.extend({
|
||||
menu: $( this ),
|
||||
parent: false,
|
||||
scrollHide: false,
|
||||
offsetElement: '#wpadminbar',
|
||||
disableOn: function() {
|
||||
return true;
|
||||
},
|
||||
transition: "none"
|
||||
}, options );
|
||||
|
||||
var body = $( 'body' ),
|
||||
parent = null,
|
||||
offset = null,
|
||||
autoHide = false;
|
||||
|
||||
if ( settings.parent ) {
|
||||
parent = settings.parent;
|
||||
} else {
|
||||
parent = settings.menu.parent();
|
||||
}
|
||||
|
||||
if (
|
||||
settings.menu.parents( '.site-header' ).length > 0 ||
|
||||
settings.menu.parents( '.generate-page-header' ).length > 0 ||
|
||||
settings.menu.parents( '.header-wrap' ).length > 0 ||
|
||||
settings.menu.parents( '.site-wrapper' ).length > 0
|
||||
) {
|
||||
parent = body;
|
||||
}
|
||||
|
||||
if ( ( body.hasClass( 'nav-right-sidebar' ) || body.hasClass( 'nav-left-sidebar' ) ) && ! $( '.menu-toggle' ).is( ':visible' ) ) {
|
||||
settings.menu = $( '.gen-sidebar-nav' );
|
||||
parent = $( '.site-content' );
|
||||
|
||||
if ( settings.menu.children().hasClass( 'auto-hide-sticky' ) ) {
|
||||
autoHide = true;
|
||||
}
|
||||
}
|
||||
|
||||
offset = ( jQuery( settings.offsetElement ).length > 0 && jQuery( settings.offsetElement ).css( 'position' ) == 'fixed' ) ? jQuery( settings.offsetElement ).outerHeight() : 0;
|
||||
|
||||
var stickyOptions = {
|
||||
scrollHide: settings.scrollHide,
|
||||
keepInWrapper: true,
|
||||
wrapperSelector: parent,
|
||||
fixedClass: 'is_stuck navigation-stick navigation-clone',
|
||||
topMargin: 0,
|
||||
disableOn: settings.disableOn,
|
||||
transition: settings.transition
|
||||
};
|
||||
|
||||
settings.menu.stickUp( stickyOptions );
|
||||
}
|
||||
}( jQuery ));
|
||||
|
||||
function generateStickyDebounce(func, wait, immediate) {
|
||||
var timeout;
|
||||
return function() {
|
||||
var context = this, args = arguments;
|
||||
var later = function() {
|
||||
timeout = null;
|
||||
if (!immediate) func.apply(context, args);
|
||||
};
|
||||
var callNow = immediate && !timeout;
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(later, wait);
|
||||
if (callNow) func.apply(context, args);
|
||||
};
|
||||
};
|
||||
|
||||
jQuery( function( $ ) {
|
||||
var resizeEvent = 'onorientationchange' in window ? 'orientationchange' : 'resize',
|
||||
body = $( 'body' ),
|
||||
transition = 'none';
|
||||
|
||||
if ( body.hasClass( 'sticky-enabled' ) ) {
|
||||
|
||||
var navigation = $( '#site-navigation' );
|
||||
|
||||
var navigationDisableOn = function() {
|
||||
var body = $( 'body' ),
|
||||
mobileHeader = $( '#mobile-header' ),
|
||||
mobile = $( '.menu-toggle' );
|
||||
|
||||
if ( body.hasClass( 'desktop-sticky-menu' ) && mobile.is( ':visible' ) ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if ( body.hasClass( 'mobile-sticky-menu' ) && ! mobile.is( ':visible' ) ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if ( body.hasClass( 'mobile-header' ) && mobileHeader.is( ':visible' ) ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
if ( body.hasClass( 'sticky-menu-fade' ) ) {
|
||||
transition = 'fade';
|
||||
}
|
||||
|
||||
if ( body.hasClass( 'sticky-menu-slide' ) ) {
|
||||
transition = 'slide';
|
||||
}
|
||||
|
||||
var autoHide = ( navigation.hasClass( 'auto-hide-sticky' ) ) ? true : false;
|
||||
|
||||
var options = {
|
||||
transition: transition,
|
||||
scrollHide: autoHide,
|
||||
disableOn: navigationDisableOn
|
||||
};
|
||||
|
||||
$( navigation ).GenerateSimpleSticky( options );
|
||||
|
||||
body.on( 'generate_navigation_location_updated', function() {
|
||||
navigation.trigger( 'stickUp:detach' );
|
||||
setTimeout(function() {
|
||||
$( navigation ).GenerateSimpleSticky( options );
|
||||
}, 250);
|
||||
});
|
||||
}
|
||||
|
||||
if ( body.hasClass( 'mobile-header' ) && body.hasClass( 'mobile-header-sticky' ) ) {
|
||||
|
||||
var mobileHeader = $( '#mobile-header' );
|
||||
|
||||
mobileHeader.GenerateSimpleSticky({
|
||||
scrollHide: ( mobileHeader.data( 'auto-hide-sticky' ) || '' === mobileHeader.data( 'auto-hide-sticky' ) ) ? true : false,
|
||||
disableOn: function() {
|
||||
if ( ! mobileHeader.is( ':visible' ) ) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var sidebarNavClone = $( '.sidebar-nav-mobile' ),
|
||||
sidebarNav = $( '.gen-sidebar-nav' ),
|
||||
windowWidth = $( window ).width();
|
||||
|
||||
var checkSidebarNav = generateStickyDebounce( function() {
|
||||
if ( windowWidth !== $( window ).width() ) {
|
||||
if ( sidebarNavClone.is( ':visible' ) ) {
|
||||
sidebarNav.trigger( 'stickUp:detach' );
|
||||
sidebarNavClone.trigger( 'stickUp:detach' );
|
||||
sidebarNavClone.GenerateSimpleSticky( options );
|
||||
}
|
||||
|
||||
if ( sidebarNav.is( ':visible' ) ) {
|
||||
sidebarNavClone.trigger( 'stickUp:detach' );
|
||||
sidebarNav.trigger( 'stickUp:detach' );
|
||||
sidebarNav.GenerateSimpleSticky( options );
|
||||
}
|
||||
}
|
||||
}, 250);
|
||||
|
||||
if ( $( 'body' ).hasClass( 'sticky-enabled' ) && sidebarNavClone.length ) {
|
||||
window.addEventListener( 'resize', checkSidebarNav );
|
||||
window.addEventListener( 'orientationchange', checkSidebarNav );
|
||||
}
|
||||
|
||||
// Weak workaround for iOS bug when using a focused form in a sticky element.
|
||||
if ( navigator.userAgent.match( /(iPod|iPhone|iPad)/ ) ) {
|
||||
if ( body.hasClass( 'sticky-enabled' ) || ( body.hasClass( 'mobile-header' ) && body.hasClass( 'mobile-header-sticky' ) ) ) {
|
||||
$( document ).on( 'focus', '.navigation-stick .search-field', function() {
|
||||
$( 'html, body' ).animate({ scrollTop: 0 }, 'fast' );
|
||||
} );
|
||||
}
|
||||
}
|
||||
|
||||
var closeMobileMenu = function( item ) {
|
||||
var _this = item,
|
||||
url = _this.getAttribute( 'href' );
|
||||
|
||||
if ( _this.pathname === window.location.pathname && '#' !== url ) {
|
||||
if ( _this.closest( 'nav' ).classList.contains( 'toggled' ) ) {
|
||||
_this.closest( 'nav' ).classList.remove( 'toggled' );
|
||||
|
||||
if ( $( 'html' ).hasClass( 'mobile-menu-open' ) ) {
|
||||
$( 'html' ).removeClass( 'mobile-menu-open' );
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if ( body.hasClass( 'both-sticky-menu' ) || body.hasClass( 'mobile-sticky-menu' ) ) {
|
||||
$( '.main-navigation:not(#mobile-header) ul a[href*=\\#]' ).on( 'click', function( event ) {
|
||||
closeMobileMenu( this );
|
||||
} );
|
||||
}
|
||||
|
||||
if ( body.hasClass( 'mobile-header-sticky' ) ) {
|
||||
$( '#mobile-header ul a[href*=\\#]' ).on( 'click', function( event ) {
|
||||
closeMobileMenu( this );
|
||||
} );
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1 @@
|
||||
function generateStickyDebounce(s,n,a){var o;return function(){var t=this,e=arguments,i=a&&!o;clearTimeout(o),o=setTimeout(function(){o=null,a||s.apply(t,e)},n),i&&s.apply(t,e)}}!function(M,E,W){function e(t,e){var i=0,s=0,n="",a=0,o=!1,r=!1,l=!1,c=!1,d=0,p=0,h=0,m=0,u=M(),f=M("body"),g=0,b=0,k=0,v=M(t).clone().css({visibility:"hidden",display:"none"}).attr({id:"sticky-placeholder","aria-hidden":!0,itemtype:null,itemscope:null}),y=M(),w={top:0,bottom:0,custom:[]},C={scrollHide:!1,lazyHeight:0,topMargin:"auto",keepInWrapper:!1,wrapperSelector:"",zIndex:1e4,namespaceClass:"stuckElement",fixedClass:"isStuck",disableOn:function(){return!0},transition:"none"},I=function(){var t=0<jQuery("#wpadminbar").length&&"fixed"==jQuery("#wpadminbar").css("position")?jQuery("#wpadminbar").outerHeight():0;return"auto"===C.topMargin?parseInt(t+u.css("marginTop")):isNaN(C.topMargin)&&0<C.topMargin.search("px")?parseInt(t+C.topMargin.replace("px","")):isNaN(parseInt(C.topMargin))?0:parseInt(t+C.topMargin)},H=function(){v.remove(),u.removeClass(C.fixedClass).css({"max-width":"","margin-top":"","margin-left":"","margin-right":"",position:"",top:"",left:"",right:"",bottom:"",width:"",opacity:"",height:"",overflow:"","-webkit-transform":"","-ms-transform":"",transform:"","-webkit-transition":"","-ms-transition":"",transition:"",visibility:"","z-index":""}).removeClass("sticky-navigation-transition").removeClass("navigation-transition").removeClass("sticky-nav-scrolling-up"),"sticky-navigation"===u.attr("id")&&u.attr("id","site-navigation"),l=r=o=!1,u.trigger("stickUp:unStick")},x=function(t){M(v).insertAfter(u).show().addClass(C.fixedClass);var e,i=v.offsetParent();t&&(u.css({position:"absolute"}),e=y.offset().top+y.outerHeight()-i.offset().top-p-parseInt(y.css("paddingBottom"))),u.css({position:"absolute",marginTop:b,bottom:"",left:v.position().left,top:t?e:u.offset().top-i.offset().top-b}),u.trigger("stickUp:holdIt")},S=function(){o=!0,C.zIndex&&u.css("z-index",C.zIndex),"fade"==C.transition&&u.hide(),"slide"!=C.transition&&!C.scrollHide||u.css({height:"0",overflow:"hidden",visibility:"hidden"}),M(v).insertAfter(u).show().addClass(C.fixedClass),M(".gen-sidebar-nav").length&&v.css("height",u.outerHeight()),"left"!=u.css("float")&&"right"!=u.css("float")||(v.css("float",u.css("float")),v.attr("style",v.attr("style")+"width:auto !important;")),"slide"==C.transition&&"block"==v.css("display")&&u.css({"-webkit-transform":"translateY(-100%)","-ms-transform":"translateY(-100%)",transform:"translateY(-100%)","-webkit-transition":"transform 300ms ease-in-out","-ms-transition":"transform 300ms ease-in-out",transition:"transform 300ms ease-in-out"}),u.addClass(C.fixedClass),"site-navigation"===u.attr("id")&&u.attr("id","sticky-navigation");var t=-k;u.css({"margin-top":b,position:"fixed",top:t+"px",left:"",right:"",bottom:""}),u.trigger("stickUp:stickIt"),"fade"==C.transition&&u.fadeIn(300),"slide"==C.transition&&u.one("webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend",function(t){u.css({visibility:"",height:"",overflow:""}),setTimeout(function(){u.css({"-webkit-transform":"translateY(0)","-ms-transform":"translateY(0)",transform:"translateY(0)"})},10)}),C.scrollHide&&u.css({height:"",overflow:"",visibility:""})},U=function(){v&&v.width()!==u.outerWidth()&&u.outerWidth(v.outerWidth())},z=function(t){var e;C.disableOn()?(c=c&&!1,(!C.keepInWrapper||y.is(":visible"))&&(s=M(t.target).scrollTop(),n=i<=s?"down":"up",a=Math.abs(i-s),M(E).outerHeight(),i=s,h=u.offset().top,d=parseInt(u.outerHeight()+b)+parseInt(u.css("marginBottom")),o||l||r||(parseInt(u.outerHeight(!0)),r||l?(w.top=parseInt(v.offset().top),parseInt(u.offset().left)):w.top=parseInt(u.offset().top)),p=parseInt(u.outerHeight())+parseInt(u.css("margin-bottom"))+b,C.keepInWrapper?w.bottom=y.offset().top+y.outerHeight()-parseInt(y.css("paddingBottom")):w.bottom=M(W).outerHeight(),m=u.offset().top+p,k=C.scrollHide?d+C.lazyHeight:C.lazyHeight,"none"!==C.transition&&(g=2*u.outerHeight()),b=null!==C.topMargin?I():0,o&&b!==u.css("margin-top")&&u.css("margin-top",b),(!o&&!r&&s>=w.top-b+k+g||r&&l&&s<=h-b+k)&&(S(),l=r=!(o=!0)),o&&!r&&s>=w.top-b+k+u.outerHeight()/2&&(v.addClass("sticky-navigation-transition"),u.addClass("sticky-navigation-transition")),C.keepInWrapper&&parseInt(m-b)!==parseInt(w.bottom)&&s>=w.bottom-p+k&&(x(!0),l=r=!(o=!1)),o&&(t=parseInt(u.css("top")),"up"===n&&0!==t?(e=-t<a?0:t+a,u.css("top",e+"px"),u.addClass("sticky-nav-scrolling-up")):"down"===n&&-k<t&&(e=k+t<a?-k:t-a,u.css("top",e+"px"),u.removeClass("sticky-nav-scrolling-up"))),(o||l||r)&&s<=w.top-b&&H(),o||l||r)&&U()):c||(H(),c=!0)},T=function(t){l&&(x(),r=!1),z(t)};!function(t,e){(u=M(t)).addClass(C.namespaceClass),e&&M.extend(!0,C,e),b=null!==C.topMargin?I():0,C.lazyHeight&&(b+=C.lazyHeight),C.keepInWrapper?(y=""!==C.wrapperSelector?u.closest(C.wrapperSelector):y).length||(y=u.parent()):y=f,M(E).on("scroll.stickUp",z),M(E).on("resize.stickUp",T),z({target:W})}.call(this,t,e),M(t).on("sticLine truncated
|
||||
Reference in new issue
Block a user