47 lines
1.3 KiB
TypeScript
47 lines
1.3 KiB
TypeScript
'use client';
|
|
import "bootstrap-icons/font/bootstrap-icons.css";
|
|
import "@/styles/sass/bootstrap.scss";
|
|
import BootstrapClient from "@/components/bootstrap-client";
|
|
import { motion } from "framer-motion";
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: Readonly<{
|
|
children: React.ReactNode;
|
|
}>) {
|
|
return (
|
|
<html lang="en">
|
|
<body className="overflow">
|
|
<BootstrapClient />
|
|
<motion.div
|
|
initial={{ opacity: 0 }}
|
|
animate={{ opacity: 1 }}
|
|
transition={{ duration: 1 }}
|
|
className="d-flex flex-column min-vh-100"
|
|
>
|
|
<div className="circle-background">
|
|
{[150, 300, 450, 600, 900].map((size, i) => (
|
|
<motion.div
|
|
key={i}
|
|
className="circle"
|
|
initial={{ scale: 0 }}
|
|
animate={{ scale: 3 }}
|
|
transition={{
|
|
delay: 1 + i * 0.3, // empieza después de la animación del texto
|
|
duration: 2,
|
|
ease: "easeOut",
|
|
}}
|
|
style={{
|
|
width: size,
|
|
height: size,
|
|
}}
|
|
/>
|
|
))}
|
|
</div>
|
|
{children}
|
|
</motion.div>
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|