I am currently building a website with Kirby CMS and are using Parameters in the URL to filter my articles. At the same time i have a very basic css switcher implemented, which enables me to switch between list and gallery view without any reloads (I assumed). But when I am in gallery view (the css only loaded when the switcher is used) and the url changes to pass the parameters for the filter, the site reverts to the initial css (list view). How can i prevent that from happening?

My humble CSS Switcher

function list() {
  var theme = document.getElementById('css');
  theme.href = "/assets/css/templates/works.css";
}

function gallery() {
  var theme = document.getElementById('css');
  theme.href = "/assets/css/templates/works-gallery.css";
}

Filter

<filter class="filter">
  <a href="<?= $page->url() ?>?filter=">All</a>
  <?php foreach ($filters as $filter): ?>
  <a href="?filter=<?= $filter ?>"><?= $filter ?></a>
  <?php endforeach ?>
</filter>

Respective Page Controller

return function ($page) {

  $filterBy   = get('filter');
  $unfiltered = $page->children()->listed();
  $works      = $unfiltered
  ->when($filterBy, function($filterBy) {
    return $this->filterBy('category', $filterBy);
  });
  $filters    = $unfiltered->pluck('category', null, true);

  return [
    'filterBy'    => $filterBy,
    'unfiltered'  => $unfiltered,
    'works'       => $works,
    'filters'     => $filters
  ];

};