fix(ui): Consistently use min-width media queries

Because we were using a mix of `max-width` and `min-width` media queries
at the specific pixel size of the query one would apply but not the
other, in some cases causing the layout to completely break.

Author: evanpurkhiser

static/app/views/issueList/actions/index.tsx

@@ -178,8 +178,8 @@ function IssueListActions({
   );
   const theme = useTheme();
 
-  const disableActions = useMedia(
-    `(max-width: ${isSavedSearchesOpen ? theme.breakpoints.xl : theme.breakpoints.md})`
+  const disableActions = !useMedia(
+    `(min-width: ${isSavedSearchesOpen ? theme.breakpoints.xl : theme.breakpoints.md})`
   );
 
   const numIssues = selectedIdsSet.size;

static/app/views/issueList/groupListBody.tsx

@@ -100,8 +100,8 @@ function GroupList({
     false
   );
   const topIssue = groupIds[0];
-  const canSelect = !useMedia(
-    `(max-width: ${isSavedSearchesOpen ? theme.breakpoints.xl : theme.breakpoints.md})`
+  const canSelect = useMedia(
+    `(min-width: ${isSavedSearchesOpen ? theme.breakpoints.xl : theme.breakpoints.md})`
   );
 
   const columns: GroupListColumn[] = [

static/app/views/nav/context.tsx

@@ -56,7 +56,7 @@ export function NavContextProvider({children}: {children: React.ReactNode}) {
     useState<PrimaryNavGroup | null>(null);
 
   const theme = useTheme();
-  const isMobile = useMedia(`(max-width: ${theme.breakpoints.md})`);
+  const isMobile = !useMedia(`(min-width: ${theme.breakpoints.md})`);
 
   const startInteraction = useCallback(() => {
     isInteractingRef.current = true;