2020-04-07 13:03:04 +00:00
function generate _spacing _live _update ( name , id , selector , property , negative , divide , media , unit ) {
settings = typeof settings !== 'undefined' ? settings : 'generate_spacing_settings' ;
wp . customize ( settings + '[' + id + ']' , function ( value ) {
value . bind ( function ( newval ) {
negative = typeof negative !== 'undefined' ? negative : false ;
media = typeof media !== 'undefined' ? media : '' ;
divide = typeof divide !== 'undefined' ? divide : false ;
unit = typeof unit !== 'undefined' ? unit : 'px' ;
// Get new value
newval = ( divide ) ? newval / 2 : newval ;
// Check if negative integer
negative = ( negative ) ? '-' : '' ;
var isTablet = ( 'tablet' == id . substring ( 0 , 6 ) ) ? true : false ,
isMobile = ( 'mobile' == id . substring ( 0 , 6 ) ) ? true : false ;
if ( isTablet ) {
if ( '' == wp . customize ( settings + '[' + id + ']' ) . get ( ) ) {
var desktopID = id . replace ( 'tablet_' , '' ) ;
newval = wp . customize ( settings + '[' + desktopID + ']' ) . get ( ) ;
}
}
if ( isMobile ) {
if ( '' == wp . customize ( settings + '[' + id + ']' ) . get ( ) ) {
var desktopID = id . replace ( 'mobile_' , '' ) ;
newval = wp . customize ( settings + '[' + desktopID + ']' ) . get ( ) ;
}
}
// We're using a desktop value
if ( ! isTablet && ! isMobile ) {
var tabletValue = ( typeof wp . customize ( settings + '[tablet_' + id + ']' ) !== 'undefined' ) ? wp . customize ( settings + '[tablet_' + id + ']' ) . get ( ) : '' ,
mobileValue = ( typeof wp . customize ( settings + '[mobile_' + id + ']' ) !== 'undefined' ) ? wp . customize ( settings + '[mobile_' + id + ']' ) . get ( ) : '' ;
// The tablet setting exists, mobile doesn't
if ( '' !== tabletValue && '' == mobileValue ) {
media = gp _spacing . desktop + ', ' + gp _spacing . mobile ;
}
// The tablet setting doesn't exist, mobile does
if ( '' == tabletValue && '' !== mobileValue ) {
media = gp _spacing . desktop + ', ' + gp _spacing . tablet ;
}
// The tablet setting doesn't exist, neither does mobile
if ( '' == tabletValue && '' == mobileValue ) {
media = gp _spacing . desktop + ', ' + gp _spacing . tablet + ', ' + gp _spacing . mobile ;
}
}
// Check if media query
media _query = ( '' !== media ) ? 'media="' + media + '"' : '' ;
jQuery ( 'head' ) . append ( '<style id="' + name + '" ' + media _query + '>' + selector + '{' + property + ':' + negative + newval + unit + ';}</style>' ) ;
setTimeout ( function ( ) {
jQuery ( 'style#' + name ) . not ( ':last' ) . remove ( ) ;
} , 50 ) ;
jQuery ( 'body' ) . trigger ( 'generate_spacing_updated' ) ;
} ) ;
} ) ;
}
/ * *
* Top bar padding
* /
generate _spacing _live _update ( 'top_bar_top' , 'top_bar_top' , '.inside-top-bar' , 'padding-top' ) ;
generate _spacing _live _update ( 'top_bar_right' , 'top_bar_right' , '.inside-top-bar' , 'padding-right' ) ;
generate _spacing _live _update ( 'top_bar_bottom' , 'top_bar_bottom' , '.inside-top-bar' , 'padding-bottom' ) ;
generate _spacing _live _update ( 'top_bar_left' , 'top_bar_left' , '.inside-top-bar' , 'padding-left' ) ;
/ * *
* Header padding
* /
generate _spacing _live _update ( 'header_top' , 'header_top' , '.inside-header' , 'padding-top' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'header_right' , 'header_right' , '.inside-header' , 'padding-right' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'header_bottom' , 'header_bottom' , '.inside-header' , 'padding-bottom' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'header_left' , 'header_left' , '.inside-header' , 'padding-left' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'mobile_header_top' , 'mobile_header_top' , '.inside-header' , 'padding-top' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_header_right' , 'mobile_header_right' , '.inside-header' , 'padding-right' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_header_bottom' , 'mobile_header_bottom' , '.inside-header' , 'padding-bottom' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_header_left' , 'mobile_header_left' , '.inside-header' , 'padding-left' , false , false , gp _spacing . mobile ) ;
/ * *
* Content padding
* /
var content _areas = ' . separate - containers . inside - article , \
. separate - containers . comments - area , \
. separate - containers . page - header , \
. separate - containers . paging - navigation , \
. one - container . site - content , \
. inside - page - header , \
. wp - block - group _ _inner - container ' ;
generate _spacing _live _update ( 'content_top' , 'content_top' , content _areas , 'padding-top' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'content_right' , 'content_right' , content _areas , 'padding-right' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'content_bottom' , 'content_bottom' , content _areas , 'padding-bottom' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'content_left' , 'content_left' , content _areas , 'padding-left' , false , false , gp _spacing . desktop ) ;
/* Mobile content padding */
generate _spacing _live _update ( 'mobile_content_top' , 'mobile_content_top' , content _areas , 'padding-top' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_content_right' , 'mobile_content_right' , content _areas , 'padding-right' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_content_bottom' , 'mobile_content_bottom' , content _areas , 'padding-bottom' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_content_left' , 'mobile_content_left' , content _areas , 'padding-left' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'content-margin-right' , 'content_right' , '.one-container.right-sidebar .site-main,.one-container.both-right .site-main' , 'margin-right' ) ;
generate _spacing _live _update ( 'content-margin-left' , 'content_left' , '.one-container.left-sidebar .site-main,.one-container.both-left .site-main' , 'margin-left' ) ;
generate _spacing _live _update ( 'content-margin-right-both' , 'content_right' , '.one-container.both-sidebars .site-main' , 'margin-right' ) ;
generate _spacing _live _update ( 'content-margin-left-both' , 'content_left' , '.one-container.both-sidebars .site-main' , 'margin-left' ) ;
/* Content element separator */
generate _spacing _live _update ( 'content_element_separator_top' , 'content_element_separator' , '.post-image, .page-content, .entry-content, .entry-summary, footer.entry-meta' , 'margin-top' , false , false , false , 'em' ) ;
generate _spacing _live _update ( 'content_element_separator_bottom' , 'content_element_separator' , '.post-image-above-header .inside-article div.featured-image, .post-image-above-header .inside-article div.post-image' , 'margin-bottom' , false , false , false , 'em' ) ;
/ * *
* Featured image padding
* /
var featured _image _no _padding _x = ' . post - image - below - header . post - image - aligned - center . no - featured - image - padding . post - image , \
. post - image - below - header . post - image - aligned - center . no - featured - image - padding . featured - image ' ;
generate _spacing _live _update ( 'featured_image_padding_right' , 'content_right' , featured _image _no _padding _x , 'margin-right' , true , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'featured_image_padding_left' , 'content_left' , featured _image _no _padding _x , 'margin-left' , true , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'mobile_featured_image_padding_right' , 'mobile_content_right' , featured _image _no _padding _x , 'margin-right' , true , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_featured_image_padding_left' , 'mobile_content_left' , featured _image _no _padding _x , 'margin-left' , true , false , gp _spacing . mobile ) ;
var featured _image _no _padding _y = ' . post - image - above - header . post - image - aligned - center . no - featured - image - padding . post - image , \
. post - image - above - header . post - image - aligned - center . no - featured - image - padding . featured - image ' ;
generate _spacing _live _update ( 'featured_image_padding_top' , 'content_top' , featured _image _no _padding _y , 'margin-top' , true , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'featured_image_padding_right' , 'content_right' , featured _image _no _padding _y , 'margin-right' , true , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'featured_image_padding_left' , 'content_left' , featured _image _no _padding _y , 'margin-left' , true , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'mobile_featured_image_padding_top' , 'mobile_content_top' , featured _image _no _padding _y , 'margin-top' , true , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_featured_image_padding_right' , 'mobile_content_right' , featured _image _no _padding _y , 'margin-right' , true , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_featured_image_padding_left' , 'mobile_content_left' , featured _image _no _padding _y , 'margin-left' , true , false , gp _spacing . mobile ) ;
/ * *
* Main navigation spacing
* /
var menu _items = ' . main - navigation . main - nav ul li a , \
2020-08-13 14:53:39 +00:00
. main - navigation . menu - toggle , \
. main - navigation . mobile - bar - items a , \
. main - navigation . menu - bar - item > a ' ;
2020-04-07 13:03:04 +00:00
// Menu item width
generate _spacing _live _update ( 'menu_item_padding_left' , 'menu_item' , menu _items + ', .slideout-navigation button.slideout-exit' , 'padding-left' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'menu_item_padding_right' , 'menu_item' , menu _items + ', .slideout-navigation button.slideout-exit' , 'padding-right' , false , false , gp _spacing . desktop ) ;
// Tablet menu item width
//generate_spacing_live_update( 'tablet_menu_item_padding_left', 'tablet_menu_item', menu_items, 'padding-left', false, false, gp_spacing.tablet );
//generate_spacing_live_update( 'tablet_menu_item_padding_right', 'tablet_menu_item', menu_items, 'padding-right', false, false, gp_spacing.tablet );
// Mobile menu item width
2020-08-13 14:53:39 +00:00
generate _spacing _live _update ( 'mobile_menu_item_padding_left' , 'mobile_menu_item' , '.main-navigation .menu-toggle,.main-navigation .mobile-bar-items a, .main-navigation .menu-bar-item > a' , 'padding-left' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_menu_item_padding_right' , 'mobile_menu_item' , '.main-navigation .menu-toggle,.main-navigation .mobile-bar-items a, .main-navigation .menu-bar-item > a' , 'padding-right' , false , false , gp _spacing . mobile ) ;
2020-04-07 13:03:04 +00:00
// Menu item height
generate _spacing _live _update ( 'menu_item_height' , 'menu_item_height' , menu _items , 'line-height' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'navigation_logo_height' , 'menu_item_height' , '.main-navigation .navigation-logo img, .main-navigation .site-logo img' , 'height' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'nav_title_height' , 'menu_item_height' , '.navigation-branding .main-title' , 'line-height' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'mobile_header_logo_height' , 'menu_item_height' , '.mobile-header-navigation .mobile-header-logo img' , 'height' , false , false , gp _spacing . desktop ) ;
//generate_spacing_live_update( 'tablet_menu_item_height', 'tablet_menu_item_height', menu_items, 'line-height', false, false, gp_spacing.tablet );
//generate_spacing_live_update( 'tablet_navigation_logo_height', 'tablet_menu_item_height', '.main-navigation .navigation-logo img', 'height', false, false, gp_spacing.tablet );
//generate_spacing_live_update( 'tablet_mobile_header_logo_height', 'tablet_menu_item_height', '.mobile-header-navigation .mobile-header-logo img', 'height', false, false, gp_spacing.tablet );
generate _spacing _live _update ( 'mobile_menu_item_height' , 'mobile_menu_item_height' , menu _items , 'line-height' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_navigation_logo_height' , 'mobile_menu_item_height' , '.main-navigation .site-logo.navigation-logo img, .main-navigation .site-logo img, .main-navigation .navigation-branding img' , 'height' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_nav_title_height' , 'menu_item_height' , '.navigation-branding .main-title' , 'line-height' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_mobile_header_logo_height' , 'mobile_menu_item_height' , '.mobile-header-navigation .site-logo.mobile-header-logo img' , 'height' , false , false , gp _spacing . mobile ) ;
// Off canvas menu item height
wp . customize ( 'generate_spacing_settings[off_canvas_menu_item_height]' , function ( value ) {
value . bind ( function ( newval ) {
if ( '' == newval ) {
newval = wp . customize ( 'generate_spacing_settings[menu_item_height]' ) . get ( ) ;
}
jQuery ( 'head' ) . append ( '<style id="off_canvas_menu_item_height">.slideout-navigation.main-navigation .main-nav > ul > li > a{line-height:' + newval + 'px;}</style>' ) ;
setTimeout ( function ( ) {
jQuery ( 'style#off_canvas_menu_item_height' ) . not ( ':last' ) . remove ( ) ;
} , 200 ) ;
} ) ;
} ) ;
/ * *
* Main sub - navigation spacing
* /
generate _spacing _live _update ( 'sub_menu_item_height_top' , 'sub_menu_item_height' , '.main-navigation .main-nav ul ul li a' , 'padding-top' ) ;
generate _spacing _live _update ( 'sub_menu_item_height_right' , 'menu_item' , '.main-navigation .main-nav ul ul li a' , 'padding-right' , false , false , gp _spacing . desktop ) ;
//generate_spacing_live_update( 'tablet_sub_menu_item_height_right', 'tablet_menu_item', '.main-navigation .main-nav ul ul li a', 'padding-right', false, false, gp_spacing.tablet );
generate _spacing _live _update ( 'sub_menu_item_height_bottom' , 'sub_menu_item_height' , '.main-navigation .main-nav ul ul li a' , 'padding-bottom' ) ;
generate _spacing _live _update ( 'sub_menu_item_height_left' , 'menu_item' , '.main-navigation .main-nav ul ul li a' , 'padding-left' , false , false , gp _spacing . desktop ) ;
//generate_spacing_live_update( 'tablet_sub_menu_item_height_left', 'tablet_menu_item', '.main-navigation .main-nav ul ul li a', 'padding-left', false, false, gp_spacing.tablet );
generate _spacing _live _update ( 'sub_menu_item_offset' , 'menu_item_height' , '.main-navigation ul ul' , 'top' ) ;
/ * *
* Main navigation RTL arrow spacing
* /
generate _spacing _live _update ( 'dropdown_menu_arrow' , 'menu_item' , '.menu-item-has-children .dropdown-menu-toggle' , 'padding-right' , false , false , gp _spacing . desktop ) ;
//generate_spacing_live_update( 'tablet_dropdown_menu_arrow', 'tablet_menu_item', '.menu-item-has-children .dropdown-menu-toggle', 'padding-right', false, false, gp_spacing.tablet );
/ * *
* Main sub - navigation arrow spacing
* /
generate _spacing _live _update ( 'dropdown_submenu_arrow_top' , 'sub_menu_item_height' , '.menu-item-has-children ul .dropdown-menu-toggle' , 'padding-top' ) ;
generate _spacing _live _update ( 'dropdown_submenu_arrow_bottom' , 'sub_menu_item_height' , '.menu-item-has-children ul .dropdown-menu-toggle' , 'padding-bottom' ) ;
generate _spacing _live _update ( 'dropdown_submenu_arrow_margin' , 'sub_menu_item_height' , '.menu-item-has-children ul .dropdown-menu-toggle' , 'margin-top' , true ) ;
/ * *
* Sub - Menu Width
* /
generate _spacing _live _update ( 'sub_menu_width' , 'sub_menu_width' , '.main-navigation ul ul' , 'width' ) ;
/ * *
- * Sticky menu item height
- * /
wp . customize ( 'generate_spacing_settings[sticky_menu_item_height]' , function ( value ) {
value . bind ( function ( newval ) {
if ( '' == newval ) {
newval = wp . customize ( 'generate_spacing_settings[menu_item_height]' ) . get ( ) ;
}
jQuery ( 'head' ) . append ( '<style id="sticky_menu_item_height" media="' + gp _spacing . tablet + ',' + gp _spacing . desktop + '">.main-navigation.sticky-navigation-transition .main-nav > ul > li > a,.sticky-navigation-transition .menu-toggle,.main-navigation.sticky-navigation-transition .mobile-bar-items a, .main-navigation.sticky-navigation-transition .navigation-branding .main-title{line-height:' + newval + 'px;}</style>' ) ;
jQuery ( 'head' ) . append ( '<style id="sticky_menu_item_logo_height" media="' + gp _spacing . tablet + ',' + gp _spacing . desktop + '">.main-navigation.sticky-navigation-transition .navigation-logo.site-logo img, .main-navigation.sticky-navigation-transition .navigation-branding img{height:' + newval + 'px;}</style>' ) ;
jQuery ( 'head' ) . append ( '<style id="sticky_menu_item_height_transition">.main-navigation .main-nav ul li a,.menu-toggle,.main-navigation .mobile-bar-items a,.main-navigation .navigation-logo img,.main-navigation .navigation-branding img{transition:0s;}</style>' ) ;
setTimeout ( function ( ) {
jQuery ( 'style#sticky_menu_item_height' ) . not ( ':last' ) . remove ( ) ;
jQuery ( 'style#sticky_menu_item_logo_height' ) . not ( ':last' ) . remove ( ) ;
jQuery ( 'style#sticky_menu_item_height_transition' ) . remove ( ) ;
} , 200 ) ;
} ) ;
} ) ;
// Disable the transition while we resize
wp . customize ( 'generate_spacing_settings[menu_item_height]' , function ( value ) {
value . bind ( function ( newval ) {
jQuery ( 'head' ) . append ( '<style id="menu_item_height_transition">.main-navigation .main-nav ul li a,.menu-toggle,.main-navigation .mobile-bar-items a,.main-navigation .navigation-logo img, .main-navigation .navigation-branding > *{transition:0s;}</style>' ) ;
setTimeout ( function ( ) {
jQuery ( 'style#menu_item_height_transition' ) . remove ( ) ;
} , 200 ) ;
} ) ;
} ) ;
wp . customize ( 'generate_spacing_settings[off_canvas_menu_item_height]' , function ( value ) {
value . bind ( function ( newval ) {
jQuery ( 'head' ) . append ( '<style id="off_canvas_menu_item_height_transition">.main-navigation .main-nav ul li a,.menu-toggle,.main-navigation .mobile-bar-items a,.main-navigation .navigation-logo img, .main-navigation .navigation-branding > *{transition:0s;}</style>' ) ;
setTimeout ( function ( ) {
jQuery ( 'style#off_canvas_menu_item_height_transition' ) . remove ( ) ;
} , 200 ) ;
} ) ;
} ) ;
/ * *
* Widget padding
* /
generate _spacing _live _update ( 'widget_top' , 'widget_top' , '.widget-area .widget, .one-container .widget-area .widget' , 'padding-top' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'widget_right' , 'widget_right' , '.widget-area .widget, .one-container .widget-area .widget' , 'padding-right' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'widget_bottom' , 'widget_bottom' , '.widget-area .widget, .one-container .widget-area .widget' , 'padding-bottom' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'widget_left' , 'widget_left' , '.widget-area .widget, .one-container .widget-area .widget' , 'padding-left' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'mobile_widget_top' , 'mobile_widget_top' , '.widget-area .widget' , 'padding-top' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_widget_right' , 'mobile_widget_right' , '.widget-area .widget' , 'padding-right' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_widget_bottom' , 'mobile_widget_bottom' , '.widget-area .widget' , 'padding-bottom' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_widget_left' , 'mobile_widget_left' , '.widget-area .widget' , 'padding-left' , false , false , gp _spacing . mobile ) ;
/ * *
* Footer widget area
* /
generate _spacing _live _update ( 'footer_widget_container_top' , 'footer_widget_container_top' , '.footer-widgets' , 'padding-top' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'footer_widget_container_right' , 'footer_widget_container_right' , '.footer-widgets' , 'padding-right' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'footer_widget_container_bottom' , 'footer_widget_container_bottom' , '.footer-widgets' , 'padding-bottom' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'footer_widget_container_left' , 'footer_widget_container_left' , '.footer-widgets' , 'padding-left' , false , false , gp _spacing . desktop ) ;
generate _spacing _live _update ( 'mobile_footer_widget_container_top' , 'mobile_footer_widget_container_top' , '.footer-widgets' , 'padding-top' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_footer_widget_container_right' , 'mobile_footer_widget_container_right' , '.footer-widgets' , 'padding-right' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_footer_widget_container_bottom' , 'mobile_footer_widget_container_bottom' , '.footer-widgets' , 'padding-bottom' , false , false , gp _spacing . mobile ) ;
generate _spacing _live _update ( 'mobile_footer_widget_container_left' , 'mobile_footer_widget_container_left' , '.footer-widgets' , 'padding-left' , false , false , gp _spacing . mobile ) ;
/ * *
* Footer
* /
generate _spacing _live _update ( 'footer_top' , 'footer_top' , '.site-info' , 'padding-top' ) ;
generate _spacing _live _update ( 'footer_right' , 'footer_right' , '.site-info' , 'padding-right' ) ;
generate _spacing _live _update ( 'footer_bottom' , 'footer_bottom' , '.site-info' , 'padding-bottom' ) ;
generate _spacing _live _update ( 'footer_left' , 'footer_left' , '.site-info' , 'padding-left' ) ;
/ * *
* Separator
* /
/* Masonry */
if ( jQuery ( 'body' ) . hasClass ( 'masonry-enabled' ) ) {
generate _spacing _live _update ( 'masonry_separator' , 'separator' , '.masonry-post .inside-article' , 'margin-left' ) ;
generate _spacing _live _update ( 'masonry_separator_bottom' , 'separator' , '.masonry-container > article' , 'margin-bottom' ) ;
generate _spacing _live _update ( 'masonry_separator_container' , 'separator' , '.masonry-container' , 'margin-left' , 'negative' ) ;
generate _spacing _live _update ( 'masonry_separator_page_header_left' , 'separator' , '.masonry-enabled .page-header' , 'margin-left' ) ;
generate _spacing _live _update ( 'masonry_separator_page_header_bottom' , 'separator' , '.masonry-enabled .page-header' , 'margin-bottom' ) ;
generate _spacing _live _update ( 'masonry_separator_load_more' , 'separator' , '.separate-containers .site-main > .masonry-load-more' , 'margin-bottom' ) ;
}
/* Columns */
if ( jQuery ( 'body' ) . hasClass ( 'generate-columns-activated' ) ) {
generate _spacing _live _update ( 'columns_bottom' , 'separator' , '.generate-columns' , 'margin-bottom' ) ;
generate _spacing _live _update ( 'columns_left' , 'separator' , '.generate-columns' , 'padding-left' ) ;
generate _spacing _live _update ( 'columns_container' , 'separator' , '.generate-columns-container' , 'padding-left' , 'negative' ) ;
generate _spacing _live _update ( 'columns_page_header_bottom' , 'separator' , '.generate-columns-container .page-header' , 'margin-bottom' ) ;
generate _spacing _live _update ( 'columns_page_header_left' , 'separator' , '.generate-columns-container .page-header' , 'margin-left' ) ;
generate _spacing _live _update ( 'columns_pagination' , 'separator' , '.separate-containers .generate-columns-container > .paging-navigation' , 'margin-left' ) ;
}
/* Right sidebar */
if ( jQuery ( 'body' ) . hasClass ( 'right-sidebar' ) ) {
generate _spacing _live _update ( 'right_sidebar_sepatator_top' , 'separator' , '.right-sidebar.separate-containers .site-main' , 'margin-top' ) ;
generate _spacing _live _update ( 'right_sidebar_sepatator_right' , 'separator' , '.right-sidebar.separate-containers .site-main' , 'margin-right' ) ;
generate _spacing _live _update ( 'right_sidebar_sepatator_bottom' , 'separator' , '.right-sidebar.separate-containers .site-main' , 'margin-bottom' ) ;
}
/* Left sidebar */
if ( jQuery ( 'body' ) . hasClass ( 'left-sidebar' ) ) {
generate _spacing _live _update ( 'left_sidebar_sepatator_top' , 'separator' , '.left-sidebar.separate-containers .site-main' , 'margin-top' ) ;
generate _spacing _live _update ( 'left_sidebar_sepatator_left' , 'separator' , '.left-sidebar.separate-containers .site-main' , 'margin-left' ) ;
generate _spacing _live _update ( 'left_sidebar_sepatator_bottom' , 'separator' , '.left-sidebar.separate-containers .site-main' , 'margin-bottom' ) ;
}
/* Both sidebars */
if ( jQuery ( 'body' ) . hasClass ( 'both-sidebars' ) ) {
generate _spacing _live _update ( 'both_sidebars_sepatator' , 'separator' , '.both-sidebars.separate-containers .site-main' , 'margin' ) ;
}
/* Both sidebars right */
if ( jQuery ( 'body' ) . hasClass ( 'both-right' ) ) {
generate _spacing _live _update ( 'both_right_sidebar_sepatator_top' , 'separator' , '.both-right.separate-containers .site-main' , 'margin-top' ) ;
generate _spacing _live _update ( 'both_right_sidebar_sepatator_right' , 'separator' , '.both-right.separate-containers .site-main' , 'margin-right' ) ;
generate _spacing _live _update ( 'both_right_sidebar_sepatator_bottom' , 'separator' , '.both-right.separate-containers .site-main' , 'margin-bottom' ) ;
generate _spacing _live _update ( 'both_right_left_sidebar' , 'separator' , '.both-right.separate-containers .inside-left-sidebar' , 'margin-right' , false , true ) ;
generate _spacing _live _update ( 'both_right_right_sidebar' , 'separator' , '.both-right.separate-containers .inside-right-sidebar' , 'margin-left' , false , true ) ;
}
/* Both sidebars left */
if ( jQuery ( 'body' ) . hasClass ( 'both-left' ) ) {
generate _spacing _live _update ( 'both_left_sidebar_sepatator_top' , 'separator' , '.both-left.separate-containers .site-main' , 'margin-top' ) ;
generate _spacing _live _update ( 'both_left_sidebar_sepatator_right' , 'separator' , '.both-left.separate-containers .site-main' , 'margin-bottom' ) ;
generate _spacing _live _update ( 'both_left_sidebar_sepatator_bottom' , 'separator' , '.both-left.separate-containers .site-main' , 'margin-left' ) ;
generate _spacing _live _update ( 'both_left_left_sidebar' , 'separator' , '.both-left.separate-containers .inside-left-sidebar' , 'margin-right' , false , true ) ;
generate _spacing _live _update ( 'both_left_right_sidebar' , 'separator' , '.both-left.separate-containers .inside-right-sidebar' , 'margin-left' , false , true ) ;
}
/* Main element margin */
generate _spacing _live _update ( 'site_main_separator_top' , 'separator' , '.separate-containers .site-main' , 'margin-top' ) ;
generate _spacing _live _update ( 'site_main_separator_bottom' , 'separator' , '.separate-containers .site-main' , 'margin-bottom' ) ;
/* Page header element */
generate _spacing _live _update ( 'page_header_separator_top' , 'separator' ,
' . separate - containers . page - header - image , \
. separate - containers . page - header - contained , \
. separate - containers . page - header - image - single , \
. separate - containers . page - header - content - single ', ' margin - top ' ) ;
/* Top and bottom sidebar margin */
generate _spacing _live _update ( 'right_sidebar_separator_top' , 'separator' , '.separate-containers .inside-right-sidebar, .separate-containers .inside-left-sidebar' , 'margin-top' ) ;
generate _spacing _live _update ( 'right_sidebar_separator_bottom' , 'separator' , '.separate-containers .inside-right-sidebar, .separate-containers .inside-left-sidebar' , 'margin-bottom' ) ;
/* Element separators */
generate _spacing _live _update ( 'content_separator' , 'separator' ,
' . separate - containers . widget , \
. separate - containers . site - main > * , \
. separate - containers . page - header , \
. widget - area . main - navigation ', ' margin - bottom ' ) ;
/ * *
* Right sidebar width
* /
wp . customize ( 'generate_spacing_settings[right_sidebar_width]' , function ( value ) {
value . bind ( function ( newval ) {
var body = jQuery ( 'body' ) ;
if ( jQuery ( '#right-sidebar' ) . length ) {
2020-08-13 14:53:39 +00:00
if ( gp _spacing . isFlex ) {
var rightSidebar = jQuery ( '#right-sidebar' ) ;
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
if ( rightSidebar . length ) {
rightSidebar . css ( 'width' , newval + '%' ) ;
}
} else {
// Left sidebar width
var left _sidebar = ( jQuery ( '#left-sidebar' ) . length ) ? wp . customize . value ( 'generate_spacing_settings[left_sidebar_width]' ) ( ) : 0 ;
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
// Right sidebar class
jQuery ( "#right-sidebar" ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
2020-04-07 13:03:04 +00:00
} ) . removeClass ( function ( index , css ) {
2020-08-13 14:53:39 +00:00
return ( css . match ( /(^|\s)tablet-grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'grid-' + newval ) . addClass ( 'tablet-grid-' + newval ) . addClass ( 'grid-parent' ) ;
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
// Content area class
jQuery ( ".content-area" ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
2020-04-07 13:03:04 +00:00
} ) . removeClass ( function ( index , css ) {
2020-08-13 14:53:39 +00:00
return ( css . match ( /(^|\s)tablet-grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'grid-' + ( 100 - newval - left _sidebar ) ) . addClass ( 'tablet-grid-' + ( 100 - newval - left _sidebar ) ) . addClass ( 'grid-parent' ) ;
if ( body . hasClass ( 'both-sidebars' ) ) {
var content _width = ( 100 - newval - left _sidebar ) ;
jQuery ( '#left-sidebar' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'pull-' + ( content _width ) ) . addClass ( 'tablet-pull-' + ( content _width ) ) ;
}
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
if ( body . hasClass ( 'both-left' ) ) {
var total _sidebar _width = ( parseInt ( left _sidebar ) + parseInt ( newval ) ) ;
jQuery ( '#right-sidebar' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'pull-' + ( 100 - total _sidebar _width ) ) . addClass ( 'tablet-pull-' + ( 100 - total _sidebar _width ) ) ;
jQuery ( '#left-sidebar' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'pull-' + ( 100 - total _sidebar _width ) ) . addClass ( 'tablet-pull-' + ( 100 - total _sidebar _width ) ) ;
jQuery ( '.content-area' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'push-' + ( total _sidebar _width ) ) . addClass ( 'tablet-push-' + ( total _sidebar _width ) ) ;
}
2020-04-07 13:03:04 +00:00
}
jQuery ( 'body' ) . trigger ( 'generate_spacing_updated' ) ;
}
} ) ;
} ) ;
/ * *
* Left sidebar width
* /
wp . customize ( 'generate_spacing_settings[left_sidebar_width]' , function ( value ) {
value . bind ( function ( newval ) {
var body = jQuery ( 'body' ) ;
if ( jQuery ( '#left-sidebar' ) . length ) {
2020-08-13 14:53:39 +00:00
if ( gp _spacing . isFlex ) {
var leftSidebar = jQuery ( '#left-sidebar' ) ;
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
if ( leftSidebar . length ) {
leftSidebar . css ( 'width' , newval + '%' ) ;
}
} else {
// Right sidebar width
var right _sidebar = ( jQuery ( '#right-sidebar' ) . length ) ? wp . customize . value ( 'generate_spacing_settings[right_sidebar_width]' ) ( ) : 0 ;
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
// Right sidebar class
jQuery ( "#left-sidebar" ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
2020-04-07 13:03:04 +00:00
} ) . removeClass ( function ( index , css ) {
2020-08-13 14:53:39 +00:00
return ( css . match ( /(^|\s)tablet-grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'grid-' + newval ) . addClass ( 'tablet-grid-' + newval ) . addClass ( 'grid-parent' ) ;
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
// Content area class
jQuery ( ".content-area" ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
2020-04-07 13:03:04 +00:00
} ) . removeClass ( function ( index , css ) {
2020-08-13 14:53:39 +00:00
return ( css . match ( /(^|\s)tablet-grid-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'grid-' + ( 100 - newval - right _sidebar ) ) . addClass ( 'tablet-grid-' + ( 100 - newval - right _sidebar ) ) . addClass ( 'grid-parent' ) ;
if ( body . hasClass ( 'left-sidebar' ) ) {
jQuery ( '#left-sidebar' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'pull-' + ( 100 - newval ) ) . addClass ( 'tablet-pull-' + ( 100 - newval ) ) ;
jQuery ( '.content-area' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'push-' + newval ) . addClass ( 'tablet-push-' + newval ) . addClass ( 'grid-' + ( 100 - newval ) ) . addClass ( 'tablet-grid-' + ( 100 - newval ) ) ;
}
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
if ( body . hasClass ( 'both-sidebars' ) ) {
var content _width = ( 100 - newval - right _sidebar ) ;
jQuery ( '#left-sidebar' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'pull-' + ( content _width ) ) . addClass ( 'tablet-pull-' + ( content _width ) ) ;
jQuery ( '.content-area' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'push-' + ( newval ) ) . addClass ( 'tablet-push-' + ( newval ) ) ;
}
2020-04-07 13:03:04 +00:00
2020-08-13 14:53:39 +00:00
if ( body . hasClass ( 'both-left' ) ) {
var content _width = ( 100 - newval - right _sidebar ) ;
var total _sidebar _width = ( parseInt ( right _sidebar ) + parseInt ( newval ) ) ;
jQuery ( '#right-sidebar' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'pull-' + ( 100 - total _sidebar _width ) ) . addClass ( 'tablet-pull-' + ( 100 - total _sidebar _width ) ) ;
jQuery ( '#left-sidebar' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'pull-' + ( 100 - total _sidebar _width ) ) . addClass ( 'tablet-pull-' + ( 100 - total _sidebar _width ) ) ;
jQuery ( '.content-area' ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-pull-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . removeClass ( function ( index , css ) {
return ( css . match ( /(^|\s)tablet-push-\S+/g ) || [ ] ) . join ( ' ' ) ;
} ) . addClass ( 'push-' + ( total _sidebar _width ) ) . addClass ( 'tablet-push-' + ( total _sidebar _width ) ) ;
}
2020-04-07 13:03:04 +00:00
}
jQuery ( 'body' ) . trigger ( 'generate_spacing_updated' ) ;
}
} ) ;
} ) ;