LukeParke/better-auth
1
0
Fork 0
mirror of https://github.com/LukeHagar/better-auth.git synced 2025-12-09 20:27:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: formatting

Browse Source
This commit is contained in:
Bereket Engida
2024-09-02 22:56:17 +03:00
parent e1f934884e
commit 4d79534d5f
100 changed files with 6427 additions and 6188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

132
docs/components/ui/background-boxes.tsx
View File

@@ -4,73 +4,73 @@ import { motion } from "framer-motion";
import { cn } from "@/lib/utils";
export const BoxesCore = ({ className, ...rest }: { className?: string }) => {
const rows = new Array(150).fill(1);
const cols = new Array(100).fill(1);
let colors = [
"--sky-300",
"--pink-300",
"--green-300",
"--yellow-300",
"--red-300",
"--purple-300",
"--blue-300",
"--indigo-300",
"--violet-300",
];
const getRandomColor = () => {
return colors[Math.floor(Math.random() * colors.length)];
};
const rows = new Array(150).fill(1);
const cols = new Array(100).fill(1);
let colors = [
"--sky-300",
"--pink-300",
"--green-300",
"--yellow-300",
"--red-300",
"--purple-300",
"--blue-300",
"--indigo-300",
"--violet-300",
];
const getRandomColor = () => {
return colors[Math.floor(Math.random() * colors.length)];
};
return (
<div
style={{
transform: `translate(-40%,-60%) skewX(-48deg) skewY(14deg) scale(0.675) rotate(0deg) translateZ(0)`,
}}
className={cn(
"absolute left-1/4 p-4 -top-1/4 flex -translate-x-1/2 -translate-y-1/2 w-full h-full z-0 ",
className
)}
{...rest}
>
{rows.map((_, i) => (
<motion.div
key={`row` + i}
className="w-16 h-8 border-l border-slate-700 relative"
>
{cols.map((_, j) => (
<motion.div
whileHover={{
backgroundColor: `var(${getRandomColor()})`,
transition: { duration: 0 },
}}
animate={{
transition: { duration: 2 },
}}
key={`col` + j}
className="w-16 h-8 border-r border-t border-slate-700 relative"
>
{j % 2 === 0 && i % 2 === 0 ? (
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth="1.5"
stroke="currentColor"
className="absolute h-6 w-10 -top-[14px] -left-[22px] text-slate-700 stroke-[1px] pointer-events-none"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M12 6v12m6-6H6"
/>
</svg>
) : null}
</motion.div>
))}
</motion.div>
))}
</div>
);
return (
<div
style={{
transform: `translate(-40%,-60%) skewX(-48deg) skewY(14deg) scale(0.675) rotate(0deg) translateZ(0)`,
}}
className={cn(
"absolute left-1/4 p-4 -top-1/4 flex -translate-x-1/2 -translate-y-1/2 w-full h-full z-0 ",
className,
)}
{...rest}
>
{rows.map((_, i) => (
<motion.div
key={`row` + i}
className="w-16 h-8 border-l border-slate-700 relative"
>
{cols.map((_, j) => (
<motion.div
whileHover={{
backgroundColor: `var(${getRandomColor()})`,
transition: { duration: 0 },
}}
animate={{
transition: { duration: 2 },
}}
key={`col` + j}
className="w-16 h-8 border-r border-t border-slate-700 relative"
>
{j % 2 === 0 && i % 2 === 0 ? (
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth="1.5"
stroke="currentColor"
className="absolute h-6 w-10 -top-[14px] -left-[22px] text-slate-700 stroke-[1px] pointer-events-none"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M12 6v12m6-6H6"
/>
</svg>
) : null}
</motion.div>
))}
</motion.div>
))}
</div>
);
};
export const Boxes = React.memo(BoxesCore);