diff --git a/assets/js/src/custom.js b/assets/js/src/custom.js index cf601f5c..1c7b19d4 100644 --- a/assets/js/src/custom.js +++ b/assets/js/src/custom.js @@ -1813,16 +1813,16 @@ botiga.misc = { } }, customizer: function() { - if( ! window.parent.document.body.classList.contains( 'wp-customizer' ) ) { + if ( typeof wp === 'undefined' || typeof wp.customize === 'undefined' ) { return false; } - window.onload = function() { + wp.customize.bind( 'preview-ready', function() { var cart_count = document.querySelectorAll( '.cart-count' ); if( cart_count.length ) { jQuery( document.body ).trigger( 'wc_fragment_refresh' ); } - } + } ); } } diff --git a/assets/sass/abstracts/variables/_colors.scss b/assets/sass/abstracts/variables/_colors.scss index 8ccdc5ed..71fb3d64 100644 --- a/assets/sass/abstracts/variables/_colors.scss +++ b/assets/sass/abstracts/variables/_colors.scss @@ -20,5 +20,6 @@ $color__border-input: #ccc; $color__border-abbr: #666; $color__primary: #212121; +$color__white: #ffffff; $color__grey: #666666; $color__hover: #757575; \ No newline at end of file diff --git a/assets/sass/base/elements/_body.scss b/assets/sass/base/elements/_body.scss index b8948150..f224a2e0 100644 --- a/assets/sass/base/elements/_body.scss +++ b/assets/sass/base/elements/_body.scss @@ -32,5 +32,11 @@ body { .ws-svg-icon { width: 24px; height: 24px; + + svg { + &:not(.stroke-based) { + fill: $color__white; // change the default color to white + } + } } } \ No newline at end of file diff --git a/assets/sass/components/navigation/_navigation.scss b/assets/sass/components/navigation/_navigation.scss index 9b5f3c63..3b4780c4 100644 --- a/assets/sass/components/navigation/_navigation.scss +++ b/assets/sass/components/navigation/_navigation.scss @@ -20,7 +20,7 @@ display: flex; flex-wrap: wrap; - li + li { + > li + li { margin-left: 35px; } } @@ -28,12 +28,15 @@ } } - .botiga-dropdown-ul { + .botiga-dropdown-ul, + .nav-menu { list-style: none; margin: 0; padding-left: 0; - .botiga-dropdown-ul { + .botiga-dropdown-ul, + .children, + .sub-menu { width: 200px; box-shadow: 0 0 15px rgba(0,0,0,.1); float: left; @@ -47,12 +50,16 @@ transform: translate3d(0, 15px, 0); transition: ease transform 300ms, ease opacity 300ms; - .botiga-dropdown-ul { + .botiga-dropdown-ul, + .children, + .sub-menu { left: 100%; top: 0; } - .botiga-dropdown-li { + .botiga-dropdown-li, + .page_item, + .menu-item { background: #fff; padding: 0; display: flex; @@ -60,7 +67,13 @@ &.hovered > .botiga-dropdown-ul, &:hover > .botiga-dropdown-ul, - &.focus > .botiga-dropdown-ul { + &.focus > .botiga-dropdown-ul, + &.hovered > .children, + &:hover > .children, + &.focus > .children, + &.hovered > .sub-menu, + &:hover > .sub-menu, + &.focus > .sub-menu { display: block; left: 100%; } @@ -81,7 +94,9 @@ } } - .botiga-dropdown-link { + .botiga-dropdown-link, + .page_item a, + .menu-item a { width: 100%; display: inline-block; text-transform: none; @@ -91,7 +106,13 @@ .botiga-dropdown-li.hovered > .botiga-dropdown-ul, .botiga-dropdown-li:hover > .botiga-dropdown-ul, - .botiga-dropdown-li.focus > .botiga-dropdown-ul { + .botiga-dropdown-li.focus > .botiga-dropdown-ul, + .page_item.hovered > .children, + .page_item:hover > .children, + .page_item.focus > .children, + .menu-item.hovered > .sub-menu, + .menu-item:hover > .sub-menu, + .menu-item.focus > .sub-menu { left: auto; top: 100%; opacity: 1; @@ -109,7 +130,9 @@ bottom: 100%; } - .botiga-dropdown-ul { + .botiga-dropdown-ul, + .children, + .sub-menu { top: 0; &.sub-menu-reverse { @@ -125,7 +148,9 @@ } } - .botiga-dropdown-li { + .botiga-dropdown-li, + .page_item, + .menu-item { position: relative; margin-right: 35px; padding-bottom: 0; @@ -135,7 +160,9 @@ } } - .botiga-dropdown-link { + .botiga-dropdown-link, + .page_item a, + .menu-item a { padding: 10px 0; display: inline-block; text-decoration: none; @@ -152,14 +179,24 @@ } &.with-hover-delay { - .botiga-dropdown-ul { - .botiga-dropdown-ul { + .botiga-dropdown-ul, + .children, + .sub-menu { + .botiga-dropdown-ul, + .children, + .sub-menu { transition-delay: 0ms; } .botiga-dropdown-li.hovered > .botiga-dropdown-ul, .botiga-dropdown-li:hover > .botiga-dropdown-ul, - .botiga-dropdown-li.focus > .botiga-dropdown-ul { + .botiga-dropdown-li.focus > .botiga-dropdown-ul, + .page_item.hovered > .children, + .page_item:hover > .children, + .page_item.focus > .children, + .menu-item.hovered > .sub-menu, + .menu-item:hover > .sub-menu, + .menu-item.focus > .sub-menu { transition-delay: 300ms; } } @@ -169,17 +206,22 @@ @media(max-width: 1024px) { &.botiga-dropdown-mobile-accordion { - .botiga-dropdown-li { + .botiga-dropdown-li, + .page_item, + .menu-item { margin-right: 0; - &.menu-item-has-children { + &.menu-item-has-children, + &.page_item_has_children { display: flex; flex-wrap: wrap; - > .botiga-dropdown-link { + > .botiga-dropdown-link, + > a { width: calc( 100% - ( var(--dropdown--symbol--size) + 0.5em ) ); } - > .sub-menu { + > .sub-menu, + > .children { position: relative; width: 100%; left: 0; @@ -188,17 +230,21 @@ transform: none; box-shadow: none; - > .botiga-dropdown-li { + > .botiga-dropdown-li, + > .page_item, + > .menu-item { background-color: transparent; } - .sub-menu { + .sub-menu, + .children { padding-left: 20px; } } &.expand { - > .sub-menu { + > .sub-menu, + > .children { opacity: 1; height: auto; overflow: visible; @@ -206,7 +252,8 @@ } &:not(.expand) { - > .sub-menu { + > .sub-menu, + > .children { opacity: 0; height: 0; overflow: hidden; @@ -243,12 +290,14 @@ } /* Small menu. */ -.botiga-dropdown.toggled .botiga-dropdown-ul { +.botiga-dropdown.toggled .botiga-dropdown-ul, +.botiga-dropdown.toggled .nav-menu { display: block; } @media screen and (min-width: 1025px) { - .botiga-dropdown .botiga-dropdown-ul { + .botiga-dropdown .botiga-dropdown-ul, + .botiga-dropdown .nav-menu { display: flex; flex-wrap: wrap; }