50 lines
1.3 KiB
JavaScript
50 lines
1.3 KiB
JavaScript
|
( function ( $ ) {
|
||
|
|
/**
|
||
|
|
* Function to add the custom Class to the color picker to add a separator.
|
||
|
|
* This is used to add the add a heading to display the CartFlows Colors.
|
||
|
|
*/
|
||
|
|
const add_color_pallet_separator = function () {
|
||
|
|
$( document ).on(
|
||
|
|
'click',
|
||
|
|
'.block-editor-panel-color-gradient-settings__dropdown, .component-color-indicator',
|
||
|
|
function () {
|
||
|
|
$( '.components-circular-option-picker__option' ).each(
|
||
|
|
function () {
|
||
|
|
const color_separator = $( this );
|
||
|
|
let color_separator_wrapper = '';
|
||
|
|
|
||
|
|
if (
|
||
|
|
color_separator.attr( 'aria-label' ) ===
|
||
|
|
'Color: CartFlows Separator'
|
||
|
|
) {
|
||
|
|
color_separator_wrapper = color_separator.closest(
|
||
|
|
'.components-circular-option-picker__option-wrapper'
|
||
|
|
);
|
||
|
|
|
||
|
|
if (
|
||
|
|
! color_separator_wrapper.hasClass(
|
||
|
|
'wcf-color-pallet-separator'
|
||
|
|
)
|
||
|
|
) {
|
||
|
|
color_separator_wrapper.addClass(
|
||
|
|
'wcf-color-pallet-separator'
|
||
|
|
);
|
||
|
|
color_separator.addClass(
|
||
|
|
'wcf-color-pallet-separator--button'
|
||
|
|
);
|
||
|
|
color_separator.append(
|
||
|
|
'<span class="wcf-color-pallet-separator--heading">CartFlows Global Colors</span>'
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
);
|
||
|
|
}
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
$( function () {
|
||
|
|
add_color_pallet_separator();
|
||
|
|
} );
|
||
|
|
} )( jQuery );
|