diff options
| -rw-r--r-- | apps/web/app/(auth)/onboarding/page.tsx | 2 | ||||
| -rw-r--r-- | apps/web/app/(dash)/home/filterSpaces.tsx | 2 | ||||
| -rw-r--r-- | apps/web/app/(dash)/home/page.tsx | 23 | ||||
| -rw-r--r-- | apps/web/app/(dash)/home/queryinput.tsx | 6 | ||||
| -rw-r--r-- | packages/ui/shadcn/switch.tsx | 2 |
5 files changed, 22 insertions, 13 deletions
diff --git a/apps/web/app/(auth)/onboarding/page.tsx b/apps/web/app/(auth)/onboarding/page.tsx index df5b83d6..5b728928 100644 --- a/apps/web/app/(auth)/onboarding/page.tsx +++ b/apps/web/app/(auth)/onboarding/page.tsx @@ -49,7 +49,7 @@ export default function Home() { <Navbar /> {/* main-content */} - <div className="w-full max-w-3xl p-4 flex flex-col items-center justify-center mx-auto mt-24"> + <div className="w-full max-w-3xl p-4 flex flex-col items-center justify-center mx-auto pt-24"> {currStep === 0 && ( <div className="text-white space-y-3 flex flex-col gap-16 w-full"> <h1 className="text-3xl md:text-5xl tracking-tighter"> diff --git a/apps/web/app/(dash)/home/filterSpaces.tsx b/apps/web/app/(dash)/home/filterSpaces.tsx index ec90a29a..80c05288 100644 --- a/apps/web/app/(dash)/home/filterSpaces.tsx +++ b/apps/web/app/(dash)/home/filterSpaces.tsx @@ -53,7 +53,7 @@ export function FilterSpaces({ </div> <Command className={`group transition-all border-0 text-white outline-0 ${ - selectedSpaces.length ? "w-5 hover:w-24 focus-within:w-20" : "w-44" + selectedSpaces.length ? "w-12 hover:w-24 focus-within:w-28" : "w-44" }`} > <div className="relative flex items-center"> diff --git a/apps/web/app/(dash)/home/page.tsx b/apps/web/app/(dash)/home/page.tsx index d192d07d..0545d1ff 100644 --- a/apps/web/app/(dash)/home/page.tsx +++ b/apps/web/app/(dash)/home/page.tsx @@ -70,18 +70,25 @@ function Page({ searchParams }: { searchParams: Record<string, string> }) { }, [telegramUser]); return ( - <div className="max-w-3xl h-full justify-center flex mx-auto w-full flex-col px-2 md:px-0"> + <div className="max-w-3xl h-full pt-[25vh] mx-auto w-full px-2 md:px-0"> <motion.h1 {...{ ...slap, transition: { ...slap.transition, delay: 0.2 }, }} - className="text-center mx-auto bg-[linear-gradient(180deg,_#FFF_0%,_rgba(255,_255,_255,_0.00)_202.08%)] bg-clip-text text-4xl tracking-tighter text-transparent md:text-5xl pb-2" > - <span>Ask your</span>{" "} - <span className="inline-flex items-center gap-2 bg-gradient-to-r to-blue-300 from-zinc-300 text-transparent bg-clip-text"> - supermemory - </span> + <motion.h1 + className="text-center mx-auto bg-[linear-gradient(180deg,_#FFF_0%,_rgba(255,_255,_255,_0.00)_202.08%)] bg-clip-text text-4xl tracking-tighter text-transparent md:text-5xl" + animate={{ + opacity: query.length ? 0 : 1, + translateY: query.length ? "10px" : "0px", + }} + > + <span>Ask your</span>{" "} + <span className="inline-flex items-center gap-2 bg-gradient-to-r to-blue-300 from-zinc-300 text-transparent bg-clip-text"> + supermemory + </span> + </motion.h1> </motion.h1> <div className="w-full pb-20 mt-10"> @@ -108,7 +115,9 @@ function Page({ searchParams }: { searchParams: Record<string, string> }) { initialSpaces={spaces} /> - <History setQuery={setQuery} /> + <motion.div animate={{ opacity: query.length ? 0 : 1 }}> + <History setQuery={setQuery} /> + </motion.div> </div> <div className="w-full fixed bottom-0 left-0 p-4"> diff --git a/apps/web/app/(dash)/home/queryinput.tsx b/apps/web/app/(dash)/home/queryinput.tsx index 82561438..995fea53 100644 --- a/apps/web/app/(dash)/home/queryinput.tsx +++ b/apps/web/app/(dash)/home/queryinput.tsx @@ -52,7 +52,7 @@ function QueryInput({ name="q" cols={30} rows={3} - className="bg-transparent text-lg placeholder:text-[#9B9B9B] text-gray-200 tracking-[3%] outline-none resize-none w-full p-7" + className={`bg-transparent text-lg placeholder:text-[#9B9B9B] text-gray-200 tracking-[3%] outline-none resize-none w-full py-4 px-4 h-32 transition-[height] ${query.length > 0 && "h-40"}`} placeholder="Ask your second brain..." onKeyDown={(e) => { if (e.key === "Enter" && !e.shiftKey) { @@ -74,8 +74,8 @@ function QueryInput({ initialSpaces={initialSpaces || []} /> <div className="flex items-center gap-4"> - <div className="flex items-center gap-2"> - <Label htmlFor="pro-mode" className="text-sm text-[#9B9B9B]"> + <div className="flex items-center gap-2 p-2 rounded-lg bg-[#369DFD1A]"> + <Label htmlFor="pro-mode" className="text-sm"> Pro mode </Label> <Switch diff --git a/packages/ui/shadcn/switch.tsx b/packages/ui/shadcn/switch.tsx index c5961182..8c941b37 100644 --- a/packages/ui/shadcn/switch.tsx +++ b/packages/ui/shadcn/switch.tsx @@ -11,7 +11,7 @@ const Switch = React.forwardRef< >(({ className, ...props }, ref) => ( <SwitchPrimitives.Root className={cn( - "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-white data-[state=unchecked]:bg-[#409EFD1A]", + "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-[#3ba0ff] data-[state=unchecked]:bg-[#184670]", className, )} {...props} |