fix: prevent threads container from shrinking with viewport

ryanhopperlowe · ryanhopperlowe · commit c5b888beef98 · 2024-09-13T09:34:55.000-05:00
diff --git a/app/page.tsx b/app/page.tsx
@@ -35,8 +35,8 @@ function RunFile() {
           <Chat
             showAssistantName
             classNames={{
-              chatBar: 'w-full mx-auto lg:w-3/4 2xl:w-1/2',
-              messages: 'w-full mx-auto lg:w-3/4 2xl:w-1/2',
+              chatBar: 'w-full mx-auto xl:w-3/4 2xl:w-1/2',
+              messages: 'w-full mx-auto xl:w-3/4 2xl:w-1/2',
             }}
           />
         </div>
diff --git a/components/threads.tsx b/components/threads.tsx
@@ -40,7 +40,7 @@ const Threads: React.FC<ThreadsProps> = ({ onOpenExplore }: ThreadsProps) => {
   return (
     <div
       className={clsx(
-        `relative border-r-1 dark:border-r-zinc-800 flex flex-col transition-all duration-300 ease-in-out`,
+        `relative border-r-1 dark:border-r-zinc-800 flex flex-col transition-all duration-300 ease-in-out shrink-0`,
         {
           'w-[80px]': isCollapsed,
           'w-[350px]': !isCollapsed,

Original file line number	Diff line number	Diff line change
`@@ -40,7 +40,7 @@ const Threads: React.FC<ThreadsProps> = ({ onOpenExplore }: ThreadsProps) => {`
`40`	`40`	`return (`
`41`	`41`	`<div`
`42`	`42`	`className={clsx(`
`43`		- `relative border-r-1 dark:border-r-zinc-800 flex flex-col transition-all duration-300 ease-in-out`,
	`43`	+ `relative border-r-1 dark:border-r-zinc-800 flex flex-col transition-all duration-300 ease-in-out shrink-0`,
`44`	`44`	`{`
`45`	`45`	`'w-[80px]': isCollapsed,`
`46`	`46`	`'w-[350px]': !isCollapsed,`