Bei bestimmten Viewport ein Modul anzeigen lassen oder Klasse hinzufügen

Hallo,

ich habe eine Abfrage, wenn Modul xyz angeschaltet ist, dann soll eine Klasse zum Container hinzugefügt werden

$hasClass = '';
if ($this->countModules('sidebar-left and sidebar-right')) { $hasClass .= '-col3';}
else 
usw....

 <div class="sidebar<?php echo $hasClass1 ?>">
         <jdoc:include type="modules" name="sidebar-left" style="xhtml" />
 </div>

Ich frage mich gerade, ob ich das auch für einen Viewport einstellen kann. Also:

Wenn der Viewport min. 1200px ist dann füge dem Container folgende Klasse zu xyz

Ich hab im Netz gestöbert, aber nichts gefunden ...?!?!?!

Kann mir jemand von Euch eine Tipp geben?

Herzliche Grüße

Beate

Ok ... ich bin schon soweit:

/* JavaScript Media Queries */
if (matchMedia) {
  const mq = window.matchMedia('(min-width: 1200px)');
  mq.addListener(WidthChange);
  WidthChange(mq);
}

// media query change
function WidthChange(mq) {
if (mq.matches) {
         jQuery('.slider').attr('class','slider')
} else {
         jQuery('.slider').attr('class','slider2')
}

}

Funktioniert wunderbar ... jetzt frage ich mich, ob ich damit auch Module ausblenden kann im mobilen Bereich und ich meine nicht display:none - denn dann wird ja der Inhalt trotzdem geladen ...

Ist es mit dem Code überhaupt möglich?

Viele Grüße

Beate