small UI fix

vwh · Jul 28, 2024 · 90e0f9c · 90e0f9c
1 parent c1d893d
commit 90e0f9c
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 6 deletions.
diff --git a/src/components/dropzone.tsx b/src/components/dropzone.tsx
@@ -54,7 +54,9 @@ export default function UploadFile() {
 
   const renderDropzoneContent = useCallback(
     (hasDatabase: boolean) => (
-      <div className="flex h-full items-center justify-center gap-2">
+      <div
+        className={`flex h-full items-center justify-center gap-2 ${hasDatabase ? "px-[10px]" : "px-0"}`}
+      >
         <div
           {...getRootProps()}
           className={`flex h-full grow cursor-pointer flex-col items-center justify-center rounded border p-6 text-center ${

diff --git a/src/components/error.tsx b/src/components/error.tsx
@@ -6,9 +6,9 @@ export default function ErrorMessage({
   children: React.ReactNode;
 }) {
   return (
-    <div className="flex items-center justify-center gap-5 rounded border p-4 font-semibold">
+    <div className="flex items-center justify-center gap-4 rounded border p-4">
       <AlertTriangleIcon className="h-6 w-6" />
-      {children}
+      <span className="font-semibold">{children}</span>
     </div>
   );
 }
diff --git a/src/components/loading.tsx b/src/components/loading.tsx
@@ -2,9 +2,9 @@ import { LoaderIcon } from "lucide-react";
 
 export default function Loading({ children }: { children: React.ReactNode }) {
   return (
-    <div className="flex items-center justify-center gap-5 rounded border p-4 font-semibold">
+    <div className="flex items-center justify-center gap-4 rounded border p-4">
       <LoaderIcon className="h-6 w-6 animate-spin" />
-      <span className="ml-2 font-semibold">{children}</span>
+      <span className="font-semibold">{children}</span>
     </div>
   );
 }
diff --git a/src/components/settings.tsx b/src/components/settings.tsx
@@ -131,7 +131,7 @@ export default function Settings() {
               <p className="mb-1 text-sm text-muted-foreground">
                 Query History
               </p>
-              <ScrollArea className="h-72 rounded-md border">
+              <ScrollArea className="h-48 rounded-md border">
                 <div className="p-4">
                   {queryHestory.map((query, index) => (
                     <>