mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-08-28 05:25:33 +00:00
more tweaks
This commit is contained in:
Dhravya
parent
b199c62ec5
commit
526268f997
7 changed files with 88 additions and 23 deletions
50
apps/web/app/(dash)/home/homeVariants.ts
Normal file
50
apps/web/app/(dash)/home/homeVariants.ts
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
export const variants = [
|
||||
[
|
||||
{
|
||||
type: "text",
|
||||
content: "Unlock your",
|
||||
},
|
||||
{
|
||||
type: "highlighted",
|
||||
content: " digital brain",
|
||||
},
|
||||
],
|
||||
[
|
||||
{
|
||||
type: "text",
|
||||
content: "Save",
|
||||
},
|
||||
{
|
||||
type: "highlighted",
|
||||
content: " everything.",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
content: " Connect",
|
||||
},
|
||||
{
|
||||
type: "highlighted",
|
||||
content: " anything.",
|
||||
},
|
||||
],
|
||||
[
|
||||
{
|
||||
type: "text",
|
||||
content: "Turn your bookmarks into",
|
||||
},
|
||||
{
|
||||
type: "highlighted",
|
||||
content: " insights.",
|
||||
},
|
||||
],
|
||||
[
|
||||
{
|
||||
type: "text",
|
||||
content: "The smart way to use your",
|
||||
},
|
||||
{
|
||||
type: "highlighted",
|
||||
content: " digital treasures.",
|
||||
},
|
||||
],
|
||||
];
|
||||
|
|
@ -10,6 +10,7 @@ import { toast } from "sonner";
|
|||
import { useSession } from "next-auth/react";
|
||||
import { motion } from "framer-motion";
|
||||
import BackgroundPlus from "@/app/(landing)/GridPatterns/PlusGrid";
|
||||
import { variants } from "./homeVariants";
|
||||
|
||||
const slap = {
|
||||
initial: {
|
||||
|
|
@ -40,6 +41,8 @@ function Page({
|
|||
|
||||
const [spaces, setSpaces] = useState<{ id: number; name: string }[]>([]);
|
||||
|
||||
const [showVariant, setShowVariant] = useState<number>(0);
|
||||
|
||||
useEffect(() => {
|
||||
if (telegramUser) {
|
||||
const linkTelegram = async () => {
|
||||
|
|
@ -62,6 +65,8 @@ function Page({
|
|||
}
|
||||
// TODO: HANDLE ERROR
|
||||
});
|
||||
|
||||
setShowVariant(Math.floor(Math.random() * variants.length));
|
||||
}, []);
|
||||
|
||||
return (
|
||||
|
|
@ -69,15 +74,6 @@ function Page({
|
|||
{/* all content goes here */}
|
||||
{/* <div className="">hi {firstTime ? 'first time' : ''}</div> */}
|
||||
|
||||
<div className="relative z-20 pointer-events-none">
|
||||
<div
|
||||
className="absolute -z-10 left-0 top-[10%] h-32 w-[90%] overflow-x-hidden bg-[rgb(54,157,253)] bg-opacity-100 blur-[337.4px]"
|
||||
style={{ transform: "rotate(-30deg)" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<BackgroundPlus className="absolute top-0 left-0 w-full h-full -z-50" />
|
||||
|
||||
<motion.h1
|
||||
{...{
|
||||
...slap,
|
||||
|
|
@ -85,10 +81,20 @@ function Page({
|
|||
}}
|
||||
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"
|
||||
>
|
||||
Unlock your{" "}
|
||||
<span className="text-transparent italic bg-clip-text bg-gradient-to-r to-blue-200 from-zinc-300">
|
||||
digital brain
|
||||
</span>
|
||||
{variants[showVariant]!.map((v, i) => {
|
||||
return (
|
||||
<span
|
||||
key={i}
|
||||
className={
|
||||
v.type === "highlighted"
|
||||
? "bg-gradient-to-r to-blue-200 from-zinc-300 text-transparent bg-clip-text"
|
||||
: ""
|
||||
}
|
||||
>
|
||||
{v.content}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
</motion.h1>
|
||||
|
||||
<div className="w-full pb-20 mt-12">
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import Menu from "./menu";
|
|||
import { redirect } from "next/navigation";
|
||||
import { auth } from "../../server/auth";
|
||||
import { Toaster } from "@repo/ui/shadcn/sonner";
|
||||
import BackgroundPlus from "../(landing)/GridPatterns/PlusGrid";
|
||||
|
||||
async function Layout({ children }: { children: React.ReactNode }) {
|
||||
const info = await auth();
|
||||
|
|
@ -17,6 +18,14 @@ async function Layout({ children }: { children: React.ReactNode }) {
|
|||
<Header />
|
||||
</div>
|
||||
|
||||
<div className="relative flex justify-center z-40 pointer-events-none">
|
||||
<div
|
||||
className="absolute -z-10 left-0 top-[10%] h-32 w-[90%] overflow-x-hidden bg-[rgb(54,157,253)] bg-opacity-70 blur-[337.4px]"
|
||||
style={{ transform: "rotate(-30deg)" }}
|
||||
/>
|
||||
</div>
|
||||
<BackgroundPlus className="absolute top-0 left-0 w-full h-full -z-50 opacity-70" />
|
||||
|
||||
<Menu />
|
||||
|
||||
<div className="w-full h-full px-2 md:px-0">{children}</div>
|
||||
|
|
|
|||
|
|
@ -179,7 +179,7 @@ function Menu() {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<DialogContent className="sm:max-w-[425px]">
|
||||
<DialogContent className="sm:max-w-[425px] rounded-2xl bg-[#161f2a]/30 backdrop-blur-md">
|
||||
<form
|
||||
action={async (e: FormData) => {
|
||||
const content = e.get("content")?.toString();
|
||||
|
|
@ -201,7 +201,7 @@ function Menu() {
|
|||
Resource (URL or content)
|
||||
</Label>
|
||||
<Textarea
|
||||
className="bg-[#2B3237] focus-visible:ring-0 border-none focus-visible:ring-offset-0 mt-2"
|
||||
className="bg-[#161f2a] focus-visible:ring-0 border-none focus-visible:ring-offset-0 mt-2"
|
||||
id="content"
|
||||
name="content"
|
||||
placeholder="Start typing a note or paste a URL here. I'll remember it."
|
||||
|
|
@ -226,7 +226,9 @@ function Menu() {
|
|||
<TooltipProvider>
|
||||
<Tooltip>
|
||||
<TooltipTrigger>
|
||||
<InformationCircleIcon className="w-4 h-4" />
|
||||
<span>
|
||||
<InformationCircleIcon className="w-4 h-4" />
|
||||
</span>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>
|
||||
<p>
|
||||
|
|
@ -281,7 +283,7 @@ function Menu() {
|
|||
}
|
||||
}}
|
||||
placeholder="Save or create space by typing."
|
||||
className="bg-[#2B3237] h-min rounded-md mt-2 mb-4"
|
||||
className="bg-[#161f2a] h-min rounded-md mt-2 mb-4"
|
||||
/>
|
||||
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -56,11 +56,9 @@ const ComboboxWithCreate: React.FC<ComboboxWithCreateProps> = ({
|
|||
<Button onClick={async () => onSubmit(inputValue)} variant="link">
|
||||
{createNewMessage} "{inputValue}"
|
||||
</Button>
|
||||
<p>Start by creating a space and adding content to it</p>
|
||||
</CommandEmpty>
|
||||
<CommandGroup
|
||||
className="hidden group-focus-within:block"
|
||||
heading="Spaces"
|
||||
>
|
||||
<CommandGroup className="hidden group-focus-within:block">
|
||||
{options.map((option, idx) => (
|
||||
<CommandItem
|
||||
key={`opt-${idx}`}
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ const CommandInput = React.forwardRef<
|
|||
<CommandPrimitive.Input
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ const DialogOverlay = React.forwardRef<
|
|||
<DialogPrimitive.Overlay
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"fixed inset-0 z-50 bg-black/30 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
|
||||
"fixed inset-0 z-50 bg-black/20 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue