aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--apps/web/app/(dash)/home/homeVariants.ts50
-rw-r--r--apps/web/app/(dash)/home/page.tsx32
-rw-r--r--apps/web/app/(dash)/layout.tsx9
-rw-r--r--apps/web/app/(dash)/menu.tsx10
-rw-r--r--packages/ui/shadcn/combobox.tsx6
-rw-r--r--packages/ui/shadcn/command.tsx2
-rw-r--r--packages/ui/shadcn/dialog.tsx2
7 files changed, 88 insertions, 23 deletions
diff --git a/apps/web/app/(dash)/home/homeVariants.ts b/apps/web/app/(dash)/home/homeVariants.ts
new file mode 100644
index 00000000..ec24e22b
--- /dev/null
+++ b/apps/web/app/(dash)/home/homeVariants.ts
@@ -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.",
+ },
+ ],
+];
diff --git a/apps/web/app/(dash)/home/page.tsx b/apps/web/app/(dash)/home/page.tsx
index 12e3bad8..4f7e4af6 100644
--- a/apps/web/app/(dash)/home/page.tsx
+++ b/apps/web/app/(dash)/home/page.tsx
@@ -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">
diff --git a/apps/web/app/(dash)/layout.tsx b/apps/web/app/(dash)/layout.tsx
index edac6048..385e46e0 100644
--- a/apps/web/app/(dash)/layout.tsx
+++ b/apps/web/app/(dash)/layout.tsx
@@ -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>
diff --git a/apps/web/app/(dash)/menu.tsx b/apps/web/app/(dash)/menu.tsx
index 4b03604f..0622ddc0 100644
--- a/apps/web/app/(dash)/menu.tsx
+++ b/apps/web/app/(dash)/menu.tsx
@@ -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>
diff --git a/packages/ui/shadcn/combobox.tsx b/packages/ui/shadcn/combobox.tsx
index 9ab54ef1..0caa4a45 100644
--- a/packages/ui/shadcn/combobox.tsx
+++ b/packages/ui/shadcn/combobox.tsx
@@ -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}`}
diff --git a/packages/ui/shadcn/command.tsx b/packages/ui/shadcn/command.tsx
index dfc54283..e3b22841 100644
--- a/packages/ui/shadcn/command.tsx
+++ b/packages/ui/shadcn/command.tsx
@@ -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}
diff --git a/packages/ui/shadcn/dialog.tsx b/packages/ui/shadcn/dialog.tsx
index f162360f..1dc5f801 100644
--- a/packages/ui/shadcn/dialog.tsx
+++ b/packages/ui/shadcn/dialog.tsx
@@ -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}
generated by cgit v1.2.3 (git 2.25.1) at 2026-03-11 04:21:19 +0000