Skip to content

Commit 01c37f3

Browse files
DevWaelDevWael
authored
Merge pull request #400 from awesomemotive/issue/381-wordpress.org-preview-broken
Fix broken parts in Botiga in wordpress.org preview
2 parents a6cd712 + 1bc1f87 commit 01c37f3

File tree

4 files changed

+83
-27
lines changed

4 files changed

+83
-27
lines changed

‎assets/js/src/custom.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1813,16 +1813,16 @@ botiga.misc = {
18131813
}
18141814
},
18151815
customizer: function() {
1816-
if( ! window.parent.document.body.classList.contains( 'wp-customizer' ) ) {
1816+
if ( typeof wp === 'undefined' || typeof wp.customize === 'undefined' ) {
18171817
return false;
18181818
}
18191819

1820-
window.onload = function() {
1820+
wp.customize.bind( 'preview-ready', function() {
18211821
var cart_count = document.querySelectorAll( '.cart-count' );
18221822
if( cart_count.length ) {
18231823
jQuery( document.body ).trigger( 'wc_fragment_refresh' );
18241824
}
1825-
}
1825+
} );
18261826
}
18271827
}
18281828

‎assets/sass/abstracts/variables/_colors.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,5 +20,6 @@ $color__border-input: #ccc;
2020
$color__border-abbr: #666;
2121

2222
$color__primary: #212121;
23+
$color__white: #ffffff;
2324
$color__grey: #666666;
2425
$color__hover: #757575;

‎assets/sass/base/elements/_body.scss‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,5 +32,11 @@ body {
3232
.ws-svg-icon {
3333
width: 24px;
3434
height: 24px;
35+
36+
svg {
37+
&:not(.stroke-based) {
38+
fill: $color__white; // change the default color to white
39+
}
40+
}
3541
}
3642
}

‎assets/sass/components/navigation/_navigation.scss‎

Lines changed: 73 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -20,20 +20,23 @@
2020
display: flex;
2121
flex-wrap: wrap;
2222

23-
li + li {
23+
> li + li {
2424
margin-left: 35px;
2525
}
2626
}
2727
}
2828
}
2929
}
3030

31-
.botiga-dropdown-ul {
31+
.botiga-dropdown-ul,
32+
.nav-menu {
3233
list-style: none;
3334
margin: 0;
3435
padding-left: 0;
3536

36-
.botiga-dropdown-ul {
37+
.botiga-dropdown-ul,
38+
.children,
39+
.sub-menu {
3740
width: 200px;
3841
box-shadow: 0 0 15px rgba(0,0,0,.1);
3942
float: left;
@@ -47,20 +50,30 @@
4750
transform: translate3d(0, 15px, 0);
4851
transition: ease transform 300ms, ease opacity 300ms;
4952

50-
.botiga-dropdown-ul {
53+
.botiga-dropdown-ul,
54+
.children,
55+
.sub-menu {
5156
left: 100%;
5257
top: 0;
5358
}
5459

55-
.botiga-dropdown-li {
60+
.botiga-dropdown-li,
61+
.page_item,
62+
.menu-item {
5663
background: #fff;
5764
padding: 0;
5865
display: flex;
5966
margin-right: 0;
6067

6168
&.hovered > .botiga-dropdown-ul,
6269
&:hover > .botiga-dropdown-ul,
63-
&.focus > .botiga-dropdown-ul {
70+
&.focus > .botiga-dropdown-ul,
71+
&.hovered > .children,
72+
&:hover > .children,
73+
&.focus > .children,
74+
&.hovered > .sub-menu,
75+
&:hover > .sub-menu,
76+
&.focus > .sub-menu {
6477
display: block;
6578
left: 100%;
6679
}
@@ -81,7 +94,9 @@
8194
}
8295
}
8396

84-
.botiga-dropdown-link {
97+
.botiga-dropdown-link,
98+
.page_item a,
99+
.menu-item a {
85100
width: 100%;
86101
display: inline-block;
87102
text-transform: none;
@@ -91,7 +106,13 @@
91106

92107
.botiga-dropdown-li.hovered > .botiga-dropdown-ul,
93108
.botiga-dropdown-li:hover > .botiga-dropdown-ul,
94-
.botiga-dropdown-li.focus > .botiga-dropdown-ul {
109+
.botiga-dropdown-li.focus > .botiga-dropdown-ul,
110+
.page_item.hovered > .children,
111+
.page_item:hover > .children,
112+
.page_item.focus > .children,
113+
.menu-item.hovered > .sub-menu,
114+
.menu-item:hover > .sub-menu,
115+
.menu-item.focus > .sub-menu {
95116
left: auto;
96117
top: 100%;
97118
opacity: 1;
@@ -109,7 +130,9 @@
109130
bottom: 100%;
110131
}
111132

112-
.botiga-dropdown-ul {
133+
.botiga-dropdown-ul,
134+
.children,
135+
.sub-menu {
113136
top: 0;
114137

115138
&.sub-menu-reverse {
@@ -125,7 +148,9 @@
125148
}
126149
}
127150

128-
.botiga-dropdown-li {
151+
.botiga-dropdown-li,
152+
.page_item,
153+
.menu-item {
129154
position: relative;
130155
margin-right: 35px;
131156
padding-bottom: 0;
@@ -135,7 +160,9 @@
135160
}
136161
}
137162

138-
.botiga-dropdown-link {
163+
.botiga-dropdown-link,
164+
.page_item a,
165+
.menu-item a {
139166
padding: 10px 0;
140167
display: inline-block;
141168
text-decoration: none;
@@ -152,14 +179,24 @@
152179
}
153180

154181
&.with-hover-delay {
155-
.botiga-dropdown-ul {
156-
.botiga-dropdown-ul {
182+
.botiga-dropdown-ul,
183+
.children,
184+
.sub-menu {
185+
.botiga-dropdown-ul,
186+
.children,
187+
.sub-menu {
157188
transition-delay: 0ms;
158189
}
159190

160191
.botiga-dropdown-li.hovered > .botiga-dropdown-ul,
161192
.botiga-dropdown-li:hover > .botiga-dropdown-ul,
162-
.botiga-dropdown-li.focus > .botiga-dropdown-ul {
193+
.botiga-dropdown-li.focus > .botiga-dropdown-ul,
194+
.page_item.hovered > .children,
195+
.page_item:hover > .children,
196+
.page_item.focus > .children,
197+
.menu-item.hovered > .sub-menu,
198+
.menu-item:hover > .sub-menu,
199+
.menu-item.focus > .sub-menu {
163200
transition-delay: 300ms;
164201
}
165202
}
@@ -169,17 +206,22 @@
169206
@media(max-width: 1024px) {
170207

171208
&.botiga-dropdown-mobile-accordion {
172-
.botiga-dropdown-li {
209+
.botiga-dropdown-li,
210+
.page_item,
211+
.menu-item {
173212
margin-right: 0;
174213

175-
&.menu-item-has-children {
214+
&.menu-item-has-children,
215+
&.page_item_has_children {
176216
display: flex;
177217
flex-wrap: wrap;
178-
> .botiga-dropdown-link {
218+
> .botiga-dropdown-link,
219+
> a {
179220
width: calc( 100% - ( var(--dropdown--symbol--size) + 0.5em ) );
180221
}
181222

182-
> .sub-menu {
223+
> .sub-menu,
224+
> .children {
183225
position: relative;
184226
width: 100%;
185227
left: 0;
@@ -188,25 +230,30 @@
188230
transform: none;
189231
box-shadow: none;
190232

191-
> .botiga-dropdown-li {
233+
> .botiga-dropdown-li,
234+
> .page_item,
235+
> .menu-item {
192236
background-color: transparent;
193237
}
194238

195-
.sub-menu {
239+
.sub-menu,
240+
.children {
196241
padding-left: 20px;
197242
}
198243
}
199244

200245
&.expand {
201-
> .sub-menu {
246+
> .sub-menu,
247+
> .children {
202248
opacity: 1;
203249
height: auto;
204250
overflow: visible;
205251
}
206252
}
207253

208254
&:not(.expand) {
209-
> .sub-menu {
255+
> .sub-menu,
256+
> .children {
210257
opacity: 0;
211258
height: 0;
212259
overflow: hidden;
@@ -243,12 +290,14 @@
243290
}
244291

245292
/* Small menu. */
246-
.botiga-dropdown.toggled .botiga-dropdown-ul {
293+
.botiga-dropdown.toggled .botiga-dropdown-ul,
294+
.botiga-dropdown.toggled .nav-menu {
247295
display: block;
248296
}
249297

250298
@media screen and (min-width: 1025px) {
251-
.botiga-dropdown .botiga-dropdown-ul {
299+
.botiga-dropdown .botiga-dropdown-ul,
300+
.botiga-dropdown .nav-menu {
252301
display: flex;
253302
flex-wrap: wrap;
254303
}

0 commit comments

Comments
 (0)