Skip to content

Instantly share code, notes, and snippets.

.mkl_pc .mkl_pc_container span.screen-reader-text {
display: none;
}
.mkl_pc .mkl_pc_container .mkl-pc-show-form svg {
width: 30px;
display: inline-block;
vertical-align: middle;
}
.mkl_pc .mkl_pc_container .mkl_pc_toolbar section.choices > ul > li.roll-selection ul.layer_choices {
/* Fix the focus state on the choices */
.mkl_pc .mkl_pc_container .mkl_pc_toolbar section.choices > ul > li ul > li > button:hover, .mkl_pc .mkl_pc_container .mkl_pc_toolbar section.choices > ul > li ul > li > button:focus {
border-radius: 6px !important;
}
/* Improve the "loader" */
.mkl_pc.loading .loader {
background: #ffffff73;
display: flex;
@marcusig
marcusig / float-show-price-and-add-to-cart-on-mobile.css
Last active May 16, 2022 05:38
FLOAT - Show price and add to cart on mobile
@media (max-width: 660px) {
.mkl_pc .mkl_pc_container .mkl-pc-show-form {
display: none;
}
.mkl_pc .mkl_pc_container footer .form.form-cart {
position: relative;
padding: 0;
background: transparent;
box-shadow: none;
border-radius: 0;
input#quantity_60a34591cc126 {
background: #180f1f;
padding: 19px 23px;
margin: 0;
}
button.btn.btn-primary.button.configurator-add-to-cart.edgtf-btn.edgtf-btn-outline.edgtf-btn-small.edgtf-btn-stripe.primary {
padding: 8px 30px;
-webkit-clip-path: polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 0px));
clip-path: polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 0px));
<?php
add_filter( 'mkl_pc_get_configurator_data_js_output', function( $output, $id ) {
if ( class_exists( 'GTranslate' ) && is_user_logged_in() && current_user_can( 'edit_posts' ) ) {
// Add compatibility with GTranslate premium, enabling users to manually update translations.
$output = 'var PC = PC || {};'."\n";
$output .= 'PC.productData = PC.productData || {};'."\n";
$output .= "fetch('/wp-admin/admin-ajax.php?action=pc_get_data&data=init&fe=1&id={$id}&ver=" . time() . "').then(r => r.json()).then(data => {PC.productData.prod_$id = data;});";
}
return $output;
}, 20, 2 );
@media (max-width: 660px) {
.mkl_pc .mkl_pc_container .mkl_pc_toolbar {
position: relative;
top: auto;
bottom: auto;
height: auto;
}
.mkl_pc .mkl_pc_container .mkl_pc_viewer {
position: relative;
height: 350px;
/* Fix the input qty field */
.mkl_pc .mkl_pc_container .quantity input.qty {
width: 80px;
border-radius: 0;
padding: 1.2rem 1rem;
}
/* Small bar color */
.mkl_pc .mkl_pc_container .mkl_pc_toolbar section.choices + .form::before {
background: #0ad1be;
@marcusig
marcusig / change-add-to-cart-label.php
Last active June 23, 2021 18:55
Change the label of the add to cart button in the product configurator
<?php
add_filter( 'mkl_pc/add_to_cart_button/default_label', function() {
return 'New add to cart label';
} );
@marcusig
marcusig / force-cart-form-markup-in-the-configurator.php
Created June 25, 2021 07:44
Force the form.cart markup in the configurator
<?php
add_filter( 'mkl_pc_show_form', '__return_true' );
@marcusig
marcusig / inline-configurator-relative-elements-show-price.css
Last active October 12, 2021 13:04
Tweaks for the inline configurator, on mobile: Show the add to cart button and price at all times, and make things relative and take automatic hight.
@media (max-width: 660px) {
.mkl_pc .mkl_pc_container .mkl-pc-show-form {
display: none;
}
.mkl_pc .mkl_pc_container footer .form.form-cart {
position: relative;
padding: 0;
background: transparent;
box-shadow: none;
border-radius: 0;