Hi!
Well, for the compact layout max-width or other CSS changes won’t work, as the width is passed as a script argument, so those would have no effect. I think I will add mobile and tabled width options for this view as well in the upcoming release.
Until then, the only way is server side detection, and changing the arguments afterwards, using a custom code. Try adding this custom code to the functions.php in your theme/child theme directory. Before editing, please make sure to have a full site back-up just in case!
add_filter('asp_shortcode_search_options', 'asp_compact_width_change', 10, 1);
function asp_compact_width_change($args) {
$mobile_width = '280px';
$tablet_width = '400px';
// --- DO NOT CHANGE ANYTHING BELOW ----
$mdetectObj = new WD_MobileDetect();
if ( $mdetectObj->isTablet() ) {
$args['box_compact_width'] = $tablet_width;
} else if ( $mdetectObj->isMobile() ) {
$args['box_compact_width'] = $mobile_width;
}
return $args;
}Just change the $mobile_width and $tablet_width variables as you need them. Please note, that because this is a server side user-agent detection, resizing your browser won’t trigger the changes. It only works if you visit the page from actual devices, or change your browser user agent string via the developer tools, and reloading the page after.
I hope this helps!