This commit is contained in:
fgrreloaded
2025-02-18 12:10:42 +05:30
parent f76e82cff7
commit 1e547869ce
3 changed files with 14 additions and 10 deletions

View File

@@ -18,7 +18,7 @@ export function CommandDisplay({ command }: CommandDisplayProps) {
return (
<div className="relative group">
<div className="bg-gray-950/20 backdrop-blur-xl border border-gray-800 rounded-lg p-4 font-mono text-sm text-gray-300 overflow-x-auto">
<div className="bg-gray-950/20 w-fit backdrop-blur-xl border border-gray-800 rounded-lg p-4 font-mono text-sm text-gray-300 overflow-x-auto">
<button
type="button"
onClick={copyToClipboard}

View File

@@ -146,7 +146,9 @@ const CustomizableStack = () => {
}
if (activeNodes.auth !== "better-auth") {
flags.splice(flags.indexOf("-y"), 1);
if (flags.includes("-y")) {
flags.splice(flags.indexOf("-y"), 1);
}
flags.push("--no-auth");
}
@@ -159,14 +161,14 @@ const CustomizableStack = () => {
<div className="absolute -top-16 left-1/2 -translate-x-1/2 z-50 w-96">
<CommandDisplay command={generateCommand()} />
</div>
<div className="bg-gray-950/10 p-4 absolute top-4 right-4 z-50 w-96 rounded-xl border border-gray-800 backdrop-blur-3xl">
<div className="text-sm text-gray-300">
<div className="bg-gray-950/10 p-4 absolute top-4 right-4 z-50 w-80 rounded-xl border border-gray-800 backdrop-blur-3xl">
<div className="text-sm text-gray-300 text-center">
Select technologies from the left panel to customize your stack. The
graph will automatically update connections.
</div>
</div>
<div className="absolute inset-0 backdrop-blur-3xl bg-gradient-to-r from-blue-500/10 via-purple-500/10 to-pink-500/10 rounded-xl" />
<div className="h-[600px] relative backdrop-blur-sm bg-gray-950/50 rounded-xl overflow-hidden border border-gray-800">
<div className="h-[600px] pl-28 relative backdrop-blur-sm bg-gray-950/50 rounded-xl overflow-hidden border border-gray-800">
<ReactFlow
nodes={nodes}
edges={edges}

View File

@@ -33,11 +33,13 @@ export function TechNodeComponent({ data }: { data: TechNodeData }) {
return (
<div className="relative group">
<Handle
type="target"
position={Position.Top}
className="!w-1.5 !h-1.5 !bg-indigo-400/70"
/>
{data.label !== "Bun" && (
<Handle
type="target"
position={Position.Top}
className="!w-1.5 !h-1.5 !bg-indigo-400/70"
/>
)}
<div className={`${baseStyles} ${activeStyles} backdrop-blur-3xl`}>
<div className="text-white font-medium text-sm tracking-wide mb-1.5">