From af6cfa3b67f8806f5aec0b638fc893aef8aa9f53 Mon Sep 17 00:00:00 2001
From: jaredvu <jaredvu@gmail.com>
Date: Tue, 19 Dec 2023 16:37:51 -0800
Subject: [PATCH] Mobile width of HelpDialog

---
 src/views/dialogs/HelpDialog.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/views/dialogs/HelpDialog.tsx b/src/views/dialogs/HelpDialog.tsx
index 88181b1..1563032 100644
--- a/src/views/dialogs/HelpDialog.tsx
+++ b/src/views/dialogs/HelpDialog.tsx
@@ -8,6 +8,7 @@ import { ComboboxDialogMenu } from '@/components/ComboboxDialogMenu';
 import { Icon, IconName } from '@/components/Icon';
 
 import { isTruthy } from '@/lib/isTruthy';
+import { breakpoints } from '@/styles';
 
 type ElementProps = {
   setIsOpen: (open: boolean) => void;
@@ -72,8 +73,11 @@ export const HelpDialog = ({ setIsOpen }: ElementProps) => {
 const Styled: Record<string, AnyStyledComponent> = {};
 
 Styled.ComboboxDialogMenu = styled(ComboboxDialogMenu)`
-  --dialog-width: var(--dialog-small-width);
   --dialog-content-paddingTop: 1rem;
   --dialog-content-paddingBottom: 1rem;
   --comboxDialogMenu-item-gap: 1rem;
+
+  @media ${breakpoints.notMobile} {
+    --dialog-width: var(--dialog-small-width);
+  }
 `;