Merge pull request zaidmukaddam#37 from impoiler/fix/styling-patches

Fix styling in loading states
OmnipotentAI · Jan 5, 2025 · adf96e5 · adf96e5
2 parents c8acff7 + 13380b3
commit adf96e5
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/app/page.tsx b/app/page.tsx
@@ -2481,16 +2481,16 @@ Grok 2 models are now available for you to try out.
                 <div className="relative mt-4 px-0">
                     {/* Overlay with Loading Text */}
                     <div className="absolute inset-0 z-10 flex items-center justify-center">
-                        <div className="backdrop-blur-sm bg-white/30 dark:bg-black/30 rounded-2xl px-6 py-3 shadow-lg">
-                            <div className="flex items-center gap-2 text-sm font-medium text-neutral-600 dark:text-neutral-300">
+                        <div className="backdrop-blur-sm bg-white/30 dark:bg-black/30 rounded-xl px-4 h-full py-3 shadow-lg">
+                            <div className="flex items-center gap-2 text-sm font-medium text-neutral-600 h-full dark:text-neutral-300">
                                 <Loader2 className="w-4 h-4 animate-spin" />
                                 <span>Loading trending queries</span>
                             </div>
                         </div>
                     </div>
 
                     {/* Background Cards */}
-                    <div className="flex gap-2">
+                    <div className="flex justify-between">
                         {[1, 2, 3].map((_, index) => (
                             <div
                                 key={index}

diff --git a/components/ui/form-component.tsx b/components/ui/form-component.tsx
@@ -770,7 +770,7 @@ const FormComponent: React.FC<FormComponentProps> = ({
                 </div>
             )}
 
-            <div className="relative">
+            <div className="relative rounded-lg bg-neutral-100 dark:bg-neutral-900">
                 <Textarea
                     ref={inputRef}
                     placeholder={hasSubmitted ? "Ask a new question..." : "Ask a question..."}