Max Mega Menu - Version 2.4.1.3

Version Description

  • Fix: Revert/Back out CSS which changed how menu item descriptions and top aligned icons are styled. Restore related CSS to how it was in v2.4.
  • Fix: Mobile Toggle Blocks wrapping onto 2 lines
  • Fix: Mobile Toggle Icon Position before/after setting
  • Fix: Grid sub menu styling in Twenty Sixteen
  • Change: Fallback to using Flex Layout (rather than backwards compatible layout) if the css_version transient is missing
Download this release

Release Info

Developer megamenu
Plugin Icon 128x128 Max Mega Menu
Version 2.4.1.3
Comparing to
See all releases

Code changes from version 2.4.1.2 to 2.4.1.3

Files changed (6) hide show
  1. classes/toggle-blocks.class.php +10 -8
  2. classes/walker.class.php +8 -0
  3. css/megamenu.scss +53 -88
  4. css/toggle-blocks.scss +21 -16
  5. megamenu.php +3 -3
  6. readme.txt +9 -1
classes/toggle-blocks.class.php CHANGED
@@ -54,14 +54,15 @@ class Mega_Menu_Toggle_Blocks {
54
  $css_version = get_transient("megamenu_css_version");
55
 
56
  // only use HTML version of toggle block if CSS version is above 2.4.0.2
57
- if ( version_compare( '2.4.0.2', $css_version, '>=' ) ) {
58
- return "";
59
- }
60
-
61
- $closed_text = isset( $settings['closed_text'] ) ? do_shortcode( $settings['closed_text'] ) : "MENU";
62
- $open_text = isset( $settings['open_text'] ) ? do_shortcode( $settings['open_text'] ) : "MENU";
63
 
64
- $html = "<span class='mega-toggle-label'><span class='mega-toggle-label-closed'>{$closed_text}</span><span class='mega-toggle-label-open'>{$open_text}</span></span>";
 
 
 
65
 
66
  return apply_filters("megamenu_toggle_menu_toggle_html", $html);
67
 
@@ -146,7 +147,8 @@ class Mega_Menu_Toggle_Blocks {
146
  $css_version = get_transient("megamenu_css_version");
147
 
148
  // only use Flex layout version of toggle blocks if CSS version is above 2.4.0.2
149
- if ( version_compare($css_version, '2.4.0.2') >= 0 ) {
 
150
  $blocks_html = $this->get_flex_blocks_html($toggle_blocks, $content, $nav_menu, $args, $theme_id);
151
  } else {
152
  $blocks_html = $this->get_backwards_compatibility_blocks_html($toggle_blocks, $content, $nav_menu, $args, $theme_id);
54
  $css_version = get_transient("megamenu_css_version");
55
 
56
  // only use HTML version of toggle block if CSS version is above 2.4.0.2
57
+ // if transient is missing, assume the latest version of the CSS is present and use Flex layout
58
+ if ( ! $css_version || version_compare($css_version, '2.4.0.2') >= 0 ) {
59
+ $closed_text = isset( $settings['closed_text'] ) ? do_shortcode( $settings['closed_text'] ) : "MENU";
60
+ $open_text = isset( $settings['open_text'] ) ? do_shortcode( $settings['open_text'] ) : "MENU";
 
 
61
 
62
+ $html = "<span class='mega-toggle-label'><span class='mega-toggle-label-closed'>{$closed_text}</span><span class='mega-toggle-label-open'>{$open_text}</span></span>";
63
+ } else {
64
+ $html = "";
65
+ }
66
 
67
  return apply_filters("megamenu_toggle_menu_toggle_html", $html);
68
 
147
  $css_version = get_transient("megamenu_css_version");
148
 
149
  // only use Flex layout version of toggle blocks if CSS version is above 2.4.0.2
150
+ // if transient is missing, assume the latest version of the CSS is present and use Flex layout
151
+ if ( ! $css_version || version_compare($css_version, '2.4.0.2') >= 0 ) {
152
  $blocks_html = $this->get_flex_blocks_html($toggle_blocks, $content, $nav_menu, $args, $theme_id);
153
  } else {
154
  $blocks_html = $this->get_backwards_compatibility_blocks_html($toggle_blocks, $content, $nav_menu, $args, $theme_id);
classes/walker.class.php CHANGED
@@ -153,6 +153,10 @@ class Mega_Menu_Walker extends Walker_Nav_Menu {
153
  $item_output = $args->before;
154
  $item_output .= '<a'. $attributes .'>';
155
 
 
 
 
 
156
  if ( $settings['hide_text'] == 'true' ) {
157
  /** This filter is documented in wp-includes/post-template.php */
158
  } else if ( property_exists( $item, 'mega_description' ) && strlen( $item->mega_description ) ) {
@@ -161,6 +165,10 @@ class Mega_Menu_Walker extends Walker_Nav_Menu {
161
  $item_output .= $args->link_before . apply_filters( 'megamenu_the_title', $item->title, $item->ID ) . $args->link_after;
162
  }
163
 
 
 
 
 
164
  $item_output .= '</a>';
165
  $item_output .= $args->after;
166
 
153
  $item_output = $args->before;
154
  $item_output .= '<a'. $attributes .'>';
155
 
156
+ if ( in_array('icon-top', $classes ) ) {
157
+ $item_output .= "<span class='mega-title-below'>";
158
+ }
159
+
160
  if ( $settings['hide_text'] == 'true' ) {
161
  /** This filter is documented in wp-includes/post-template.php */
162
  } else if ( property_exists( $item, 'mega_description' ) && strlen( $item->mega_description ) ) {
165
  $item_output .= $args->link_before . apply_filters( 'megamenu_the_title', $item->title, $item->ID ) . $args->link_after;
166
  }
167
 
168
+ if ( is_array( $classes ) && in_array('icon-top', $classes ) ) {
169
+ $item_output .= "</span>";
170
+ }
171
+
172
  $item_output .= '</a>';
173
  $item_output .= $args->after;
174
 
css/megamenu.scss CHANGED
@@ -92,84 +92,52 @@
92
  -o-transition: background 200ms linear, color 200ms linear;
93
  transition: background 200ms linear, color 200ms linear;
94
  }
95
- }
96
-
97
- &.mega-menu-horizontal > li.mega-menu-flyout.mega-align-bottom-right ul.mega-sub-menu li.mega-menu-item {
98
- @include desktop {
99
- &.mega-has-description .mega-description-group {
100
- order: 2;
101
- }
102
- }
103
- }
104
-
105
- li.mega-menu-item.mega-has-description {
106
- > a.mega-menu-link {
107
- display: flex;
108
 
109
- .mega-description-group {
110
- display: flex;
111
- flex-direction: column;
112
- flex-grow: 1;
113
- justify-content: center;
114
-
115
- .mega-menu-title,
116
- .mega-menu-description {
117
- line-height: 1.5;
118
- }
119
 
120
- .mega-menu-description {
121
- font-style: italic;
122
- font-size: 0.8em;
123
- text-transform: none;
124
- font-weight: normal;
125
- }
126
  }
127
 
128
- &:before {
129
- align-items: center;
130
- flex-grow: 0;
131
- line-height: normal;
132
- display: inline-flex;
133
  }
134
  }
 
135
 
136
- &.mega-icon-right > a.mega-menu-link {
137
- &:before {
138
- order: 3;
139
- }
140
- }
141
 
142
- &.mega-menu-item-has-children {
143
- > a.mega-menu-link {
144
- &:after {
145
- align-items: center;
146
- flex-grow: 0;
147
- line-height: normal;
148
- display: inline-flex;
149
- }
150
- }
 
151
 
152
- li.mega-menu-item .mega-description-group {
153
- flex-basis: 1%;
154
- width: 100%;
155
- }
156
  }
157
  }
158
 
159
- li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item.mega-icon-top > a.mega-menu-link,
160
- li.mega-menu-item.mega-icon-top > a.mega-menu-link {
161
- @include desktop {
162
- display: flex;
163
- line-height: normal;
164
- flex-wrap: wrap;
165
- align-items: center;
166
- align-content: center;
167
 
168
  &:before {
169
- justify-content: space-around;
170
- flex-basis: 100%;
171
- margin: 0 0 6px 0;
172
- display: inline-flex;
173
  }
174
  }
175
  }
@@ -212,6 +180,7 @@
212
 
213
  @include desktop {
214
  &[data-effect="fade"] {
 
215
  li.mega-menu-item > ul.mega-sub-menu {
216
  opacity: 0;
217
  transition-duration: $effect_speed;
@@ -221,13 +190,17 @@
221
 
222
  &.mega-no-js li.mega-menu-item:hover > ul.mega-sub-menu,
223
  &.mega-no-js li.mega-menu-item:focus > ul.mega-sub-menu,
224
- li.mega-menu-item.mega-toggle-on > ul.mega-sub-menu {
 
225
  opacity: 1;
226
  }
 
227
  }
228
 
229
  &[data-effect="fade_up"] {
230
- li.mega-menu-item > ul.mega-sub-menu {
 
 
231
  opacity: 0;
232
  margin-top: 10px;
233
  transition-duration: $effect_speed;
@@ -237,14 +210,18 @@
237
 
238
  &.mega-no-js li.mega-menu-item:hover > ul.mega-sub-menu,
239
  &.mega-no-js li.mega-menu-item:focus > ul.mega-sub-menu,
240
- li.mega-menu-item.mega-toggle-on > ul.mega-sub-menu {
 
241
  opacity: 1;
242
  margin-top: 0;
243
  }
 
244
  }
245
 
246
  &[data-effect="slide_up"] {
247
- li.mega-menu-item > ul.mega-sub-menu {
 
 
248
  margin-top: 10px;
249
  transition-duration: $effect_speed;
250
  transition-timing-function: ease-in;
@@ -253,9 +230,11 @@
253
 
254
  &.mega-no-js li.mega-menu-item:hover > ul.mega-sub-menu,
255
  &.mega-no-js li.mega-menu-item:focus > ul.mega-sub-menu,
256
- li.mega-menu-item.mega-toggle-on > ul.mega-sub-menu {
 
257
  margin-top: 0;
258
  }
 
259
  }
260
  }
261
 
@@ -450,10 +429,14 @@
450
  li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row {
451
  width: 100%;
452
  float: left;
 
 
453
 
454
  .mega-menu-column {
455
  float: left;
456
  min-height: 1px;
 
 
457
  }
458
 
459
  @include desktop {
@@ -604,16 +587,6 @@
604
  border-bottom: $panel_second_level_border_bottom solid $panel_second_level_border_color;
605
  }
606
 
607
- &.mega-icon-top > a.mega-menu-link,
608
- &.mega-has-description > a.mega-menu-link {
609
- display: flex;
610
-
611
- &:before {
612
- align-items: flex-start;
613
- line-height: inherit;
614
- }
615
- }
616
-
617
  // Second level menu item hover
618
  > a.mega-menu-link:hover,
619
  > a.mega-menu-link:focus {
@@ -637,11 +610,6 @@
637
  vertical-align: top;
638
  display: block;
639
  }
640
-
641
- &.mega-icon-top > a.mega-menu-link,
642
- &.mega-has-description > a.mega-menu-link {
643
- display: flex;
644
- }
645
  }
646
 
647
  // Third level menu items hover
@@ -774,10 +742,6 @@
774
  vertical-align: baseline;
775
  }
776
 
777
- &.mega-has-description > a.mega-menu-link {
778
- display: flex;
779
- }
780
-
781
  &:first-child > a.mega-menu-link {
782
  border-top-left-radius: $flyout_border_radius_top_left;
783
  border-top-right-radius: $flyout_border_radius_top_right;
@@ -955,6 +919,7 @@
955
  -moz-user-select: none;
956
  -ms-user-select: none;
957
  outline: none;
 
958
 
959
  img {
960
  max-width: 100%;
92
  -o-transition: background 200ms linear, color 200ms linear;
93
  transition: background 200ms linear, color 200ms linear;
94
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
95
 
96
+ .mega-description-group {
97
+ vertical-align: middle;
98
+ display: inline-block;
 
 
 
 
 
 
 
99
 
100
+ .mega-menu-title,
101
+ .mega-menu-description {
102
+ line-height: 1.5;
103
+ display: block;
 
 
104
  }
105
 
106
+ .mega-menu-description {
107
+ font-style: italic;
108
+ font-size: 0.8em;
109
+ text-transform: none;
110
+ font-weight: normal;
111
  }
112
  }
113
+ }
114
 
 
 
 
 
 
115
 
116
+ li.mega-menu-item.mega-icon-top > a.mega-menu-link {
117
+ display: table-cell;
118
+ vertical-align: middle;
119
+ line-height: initial;
120
+
121
+ &:before {
122
+ display: block;
123
+ margin: 0 0 6px 0;
124
+ text-align: center;
125
+ }
126
 
127
+ > span.mega-title-below {
128
+ display: inline-block;
 
 
129
  }
130
  }
131
 
132
+ @include mobile {
133
+ > li.mega-menu-item.mega-icon-top > a.mega-menu-link {
134
+ display: block;
135
+ line-height: $mobile_menu_item_height;
 
 
 
 
136
 
137
  &:before {
138
+ display: inline-block;
139
+ margin: 0 6px 0 0;
140
+ text-align: left;
 
141
  }
142
  }
143
  }
180
 
181
  @include desktop {
182
  &[data-effect="fade"] {
183
+
184
  li.mega-menu-item > ul.mega-sub-menu {
185
  opacity: 0;
186
  transition-duration: $effect_speed;
190
 
191
  &.mega-no-js li.mega-menu-item:hover > ul.mega-sub-menu,
192
  &.mega-no-js li.mega-menu-item:focus > ul.mega-sub-menu,
193
+ li.mega-menu-item.mega-toggle-on > ul.mega-sub-menu,
194
+ li.mega-menu-item.mega-menu-megamenu.mega-toggle-on ul.mega-sub-menu {
195
  opacity: 1;
196
  }
197
+
198
  }
199
 
200
  &[data-effect="fade_up"] {
201
+
202
+ li.mega-menu-item.mega-menu-megamenu > ul.mega-sub-menu,
203
+ li.mega-menu-item.mega-menu-flyout ul.mega-sub-menu {
204
  opacity: 0;
205
  margin-top: 10px;
206
  transition-duration: $effect_speed;
210
 
211
  &.mega-no-js li.mega-menu-item:hover > ul.mega-sub-menu,
212
  &.mega-no-js li.mega-menu-item:focus > ul.mega-sub-menu,
213
+ li.mega-menu-item.mega-toggle-on > ul.mega-sub-menu,
214
+ li.mega-menu-item.mega-menu-megamenu.mega-toggle-on ul.mega-sub-menu {
215
  opacity: 1;
216
  margin-top: 0;
217
  }
218
+
219
  }
220
 
221
  &[data-effect="slide_up"] {
222
+
223
+ li.mega-menu-item.mega-menu-megamenu > ul.mega-sub-menu,
224
+ li.mega-menu-item.mega-menu-flyout ul.mega-sub-menu {
225
  margin-top: 10px;
226
  transition-duration: $effect_speed;
227
  transition-timing-function: ease-in;
230
 
231
  &.mega-no-js li.mega-menu-item:hover > ul.mega-sub-menu,
232
  &.mega-no-js li.mega-menu-item:focus > ul.mega-sub-menu,
233
+ li.mega-menu-item.mega-toggle-on > ul.mega-sub-menu,
234
+ li.mega-menu-item.mega-menu-megamenu.mega-toggle-on ul.mega-sub-menu {
235
  margin-top: 0;
236
  }
237
+
238
  }
239
  }
240
 
429
  li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row {
430
  width: 100%;
431
  float: left;
432
+ background: transparent;
433
+ border: 0;
434
 
435
  .mega-menu-column {
436
  float: left;
437
  min-height: 1px;
438
+ background: transparent;
439
+ border: 0;
440
  }
441
 
442
  @include desktop {
587
  border-bottom: $panel_second_level_border_bottom solid $panel_second_level_border_color;
588
  }
589
 
 
 
 
 
 
 
 
 
 
 
590
  // Second level menu item hover
591
  > a.mega-menu-link:hover,
592
  > a.mega-menu-link:focus {
610
  vertical-align: top;
611
  display: block;
612
  }
 
 
 
 
 
613
  }
614
 
615
  // Third level menu items hover
742
  vertical-align: baseline;
743
  }
744
 
 
 
 
 
745
  &:first-child > a.mega-menu-link {
746
  border-top-left-radius: $flyout_border_radius_top_left;
747
  border-top-right-radius: $flyout_border_radius_top_right;
919
  -moz-user-select: none;
920
  -ms-user-select: none;
921
  outline: none;
922
+ white-space: nowrap;
923
 
924
  img {
925
  max-width: 100%;
css/toggle-blocks.scss CHANGED
@@ -16,15 +16,20 @@
16
 
17
  .mega-toggle-block-#{$id} {
18
 
19
- &:before {
20
- content: $closed_icon;
21
- font-family: 'dashicons';
22
- font-size: $icon_size;
23
- color: $icon_color;
24
-
25
- @if $icon_position == before {
26
  margin: 0 5px 0 0;
27
- } @else {
 
 
 
 
 
 
28
  margin: 0 0 0 5px;
29
  }
30
  }
@@ -33,12 +38,6 @@
33
  color: $text_color;
34
  font-size: $text_size;
35
 
36
- @if $icon_position == before {
37
- float: right;
38
- } @else {
39
- float: left;
40
- }
41
-
42
  .mega-toggle-label-open {
43
  display: none;
44
  }
@@ -52,8 +51,14 @@
52
  &.mega-menu-open {
53
 
54
  .mega-toggle-block-#{$id} {
55
- &:before {
56
- content: $open_icon;
 
 
 
 
 
 
57
  }
58
 
59
  .mega-toggle-label-open {
16
 
17
  .mega-toggle-block-#{$id} {
18
 
19
+ @if $icon_position == before {
20
+ &:before {
21
+ content: $closed_icon;
22
+ font-family: 'dashicons';
23
+ font-size: $icon_size;
24
+ color: $icon_color;
 
25
  margin: 0 5px 0 0;
26
+ }
27
+ } @else {
28
+ &:after {
29
+ content: $closed_icon;
30
+ font-family: 'dashicons';
31
+ font-size: $icon_size;
32
+ color: $icon_color;
33
  margin: 0 0 0 5px;
34
  }
35
  }
38
  color: $text_color;
39
  font-size: $text_size;
40
 
 
 
 
 
 
 
41
  .mega-toggle-label-open {
42
  display: none;
43
  }
51
  &.mega-menu-open {
52
 
53
  .mega-toggle-block-#{$id} {
54
+ @if $icon_position == before {
55
+ &:before {
56
+ content: $open_icon;
57
+ }
58
+ } @else {
59
+ &:after {
60
+ content: $open_icon;
61
+ }
62
  }
63
 
64
  .mega-toggle-label-open {
megamenu.php CHANGED
@@ -4,7 +4,7 @@
4
  * Plugin Name: Max Mega Menu
5
  * Plugin URI: https://www.megamenu.com
6
  * Description: Easy to use drag & drop WordPress Mega Menu plugin. Create Mega Menus using Widgets. Responsive, retina & touch ready.
7
- * Version: 2.4.1.2
8
  * Author: Tom Hemsley
9
  * Author URI: https://www.megamenu.com
10
  * License: GPL-2.0+
@@ -26,13 +26,13 @@ final class Mega_Menu {
26
  /**
27
  * @var string
28
  */
29
- public $version = '2.4.1.2';
30
 
31
 
32
  /**
33
  * @var string
34
  */
35
- public $scss_last_updated = '2.4.1.2';
36
 
37
 
38
  /**
4
  * Plugin Name: Max Mega Menu
5
  * Plugin URI: https://www.megamenu.com
6
  * Description: Easy to use drag & drop WordPress Mega Menu plugin. Create Mega Menus using Widgets. Responsive, retina & touch ready.
7
+ * Version: 2.4.1.3
8
  * Author: Tom Hemsley
9
  * Author URI: https://www.megamenu.com
10
  * License: GPL-2.0+
26
  /**
27
  * @var string
28
  */
29
+ public $version = '2.4.1.3';
30
 
31
 
32
  /**
33
  * @var string
34
  */
35
+ public $scss_last_updated = '2.4.1.3';
36
 
37
 
38
  /**
readme.txt CHANGED
@@ -3,7 +3,7 @@ Contributors: megamenu
3
  Tags: menu, megamenu, mega menu, navigation, widget, dropdown menu, drag and drop, mobile, responsive, retina, theme editor, widget, shortcode, sidebar, icons, dashicons
4
  Requires at least: 3.8
5
  Tested up to: 4.9
6
- Stable tag: 2.4.1.1
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
@@ -108,6 +108,14 @@ See https://www.megamenu.com for more screenshots
108
 
109
  == Changelog ==
110
 
 
 
 
 
 
 
 
 
111
  = 2.4.1.2 [20/02/18] =
112
 
113
  * Fix: Centrally aligned mobile toggle blocks
3
  Tags: menu, megamenu, mega menu, navigation, widget, dropdown menu, drag and drop, mobile, responsive, retina, theme editor, widget, shortcode, sidebar, icons, dashicons
4
  Requires at least: 3.8
5
  Tested up to: 4.9
6
+ Stable tag: 2.4.1.2
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
108
 
109
  == Changelog ==
110
 
111
+ = 2.4.1.3 =
112
+
113
+ * Fix: Revert/Back out CSS which changed how menu item descriptions and top aligned icons are styled. Restore related CSS to how it was in v2.4.
114
+ * Fix: Mobile Toggle Blocks wrapping onto 2 lines
115
+ * Fix: Mobile Toggle Icon Position before/after setting
116
+ * Fix: Grid sub menu styling in Twenty Sixteen
117
+ * Change: Fallback to using Flex Layout (rather than backwards compatible layout) if the css_version transient is missing
118
+
119
  = 2.4.1.2 [20/02/18] =
120
 
121
  * Fix: Centrally aligned mobile toggle blocks