From 247be0c11f5872df79a6d8aeb2a251563ae485e3 Mon Sep 17 00:00:00 2001
From: MMK21Hub <50421330+MMK21Hub@users.noreply.github.com>
Date: Tue, 20 Jun 2023 22:37:39 +0100
Subject: [PATCH] Fix search filters being hidden (#1205)

* Fix search filters being hidden (#1165)

Previously, `max-width` was used to hide the sidebar on mobile, which
meant that at exactly 1024 pixels wide, the sidebar would be hidden.
However, this breakpoint is also as a
`min-width` other media queries, notably the ones used to enable viewing
filters on mobile sizes. This has caused issue #1024.

To fix this, I have swapped the logic of the rule that hides the filters
on mobile: it is now hidden by default and a `min-width` query is used
to show it on wider viewports. This is more consistent with similar media
queries in the same file.

Looking to the future, these issues should become less common if we
switch to range-based media queries:
https://caniuse.com/css-media-range-syntax

* Delete package-lock.json

---------

Co-authored-by: Prospector <6166773+Prospector@users.noreply.github.com>
---
 pages/search/[searchProjectType].vue | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/pages/search/[searchProjectType].vue b/pages/search/[searchProjectType].vue
index 7b257488..aeb334f7 100644
--- a/pages/search/[searchProjectType].vue
+++ b/pages/search/[searchProjectType].vue
@@ -848,13 +848,15 @@ export default defineNuxtComponent({
 .normal-page__sidebar {
   grid-row: 3;
 
-  // Hide on mobile unless open
-  @media screen and (max-width: 1024px) {
-    display: none;
+  // Always show on desktop
+  @media screen and (min-width: 1024px) {
+    display: block;
+  }
 
-    &.open {
-      display: block;
-    }
+  // Hide on mobile unless open
+  display: none;
+  &.open {
+    display: block;
   }
 }