With so many mobile-related modules (most of which are now poorly supported) what is the best way to selectively show Panels panes based on AdaptiveTheme breakpoints?

The Breakpoints and Breakpoints Panels module seems entirely redundant to the breakpoints build into AT. The Browscap and MobileTools-type options appear to be outdated and failing in terms of support. I'm currently trying Mobile Detect but it's based on device, not breakpoint.

It seems the "Layout" module is not yet widely adopted.

Where should I be looking for selectively excluding panes of a Panels page based on AT-managed breakpoints? Thanks!

Comments

Jeff Burnz’s picture

Breakpoints are a client (browser) side technology, which means they fire in the browser and affect the CSS (or JS if you use something like matchMedia).

Excluding something via "breakpoints" is simply going to mean you hide it, i.e. display: none; in the CSS in an appropriate media query (weather you use JS or CSS it does not matter, the end result is something is removed after it is downloaded and rendered).

The only way to actually exclude something entirely is to use device detection, aka Browscap or Mobile Detect type library and module combination - these both detect what browser/device is making the http request and return a value, which a theme or module can then use as a condition when building the output.

So, if you want to hide stuff - use CSS, AT has responsive stylesheets appropriately named for this purpose, or use your own custom media queries.

If you want to exclude stuff entirely, use device detection - AT can support this also (it can remove entire regions), or use a Panels plugin module that integrates with Browscap or Mobile Detect libraries.