diff --git a/app/Components/layout/ToastProvider.tsx b/app/Components/layout/ToastProvider.tsx index af3d64b..b21bf61 100644 --- a/app/Components/layout/ToastProvider.tsx +++ b/app/Components/layout/ToastProvider.tsx @@ -19,7 +19,7 @@ export function ToastProvider({ children }: { children: React.ReactNode }) { duration: 6000, style: { fontSize: "1.5rem", - backgroundColor: "#fee2e2dd", + backgroundColor: "#ffefefdd", color: "#000000ff", fontWeight: "600", padding: "1.5rem", @@ -30,7 +30,7 @@ export function ToastProvider({ children }: { children: React.ReactNode }) { duration: 6000, style: { fontSize: "1.5rem", - backgroundColor: "#d1fae5dd", + backgroundColor: "#ecfef5dd", color: "#000000ff", fontWeight: "600", padding: "1.5rem", diff --git a/app/creadores/creadores.css b/app/creadores/creadores.css new file mode 100644 index 0000000..a53738b --- /dev/null +++ b/app/creadores/creadores.css @@ -0,0 +1,61 @@ +.imageWrapper { + position: relative; + animation: slideIn 1s ease-out forwards; + transform: translateX(-120px) rotate(12deg); + opacity: 0; +} + +.card { + display: flex; + flex-direction: column; + align-items: center; + animation: slideIn 1s ease-out forwards; + opacity: 0; +} + +.card:hover .creators { + transform: rotateY(360deg) rotate(12deg) scale(1.05); + box-shadow: 0 30px 60px rgba(0, 0, 0, 0.35); +} + +.creators { + object-fit: cover; + border-radius: 16px; + background-color: rgba(255, 255, 255, 0.6); + box-shadow: 0 15px 30px rgba(0, 0, 0, 0.25); + transition: transform 1s ease, box-shadow 0.4s ease; +} + +.imageWrapper:hover .creators { + transform: rotateY(180deg) rotate(24deg) scale(1.05); + box-shadow: 0 30px 60px rgba(0, 0, 0, 0.35); + +} + +@keyframes slideIn { + to { + transform: translateX(0) rotate(12deg); + opacity: 1; + } +} + +.title { + margin-left: 40px; + font-size: 3rem; + font-weight: 600; + opacity: 0; + animation: fadeIn 1s ease forwards; + animation-delay: 0.5s; + color: #1E3A8A; +} + +.card:hover .title { + transform: translateY(-5px); + color: #163172; +} + +@keyframes fadeIn { + to { + opacity: 1; + } +} \ No newline at end of file diff --git a/app/creadores/page.tsx b/app/creadores/page.tsx new file mode 100644 index 0000000..0b6a559 --- /dev/null +++ b/app/creadores/page.tsx @@ -0,0 +1,39 @@ +import Image from "next/image"; +import "./creadores.css"; + +export default function Page() { + return ( +
+
+
+ +
+
+ IO +
+

IO

+
+ +
+
+ Carlos Pak +
+

Carlos Pak

+
+
+
+ + ); +} diff --git a/app/layout.tsx b/app/layout.tsx index 60aff7e..19f0f71 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -4,8 +4,8 @@ import { Inter } from "next/font/google"; import Header from "./Components/layout/Header/Header"; import Footer from "./Components/layout/Footer/Footer"; -import "./globals.css"; import { ToastProvider } from "./Components/layout/ToastProvider"; +import "./globals.css"; const inter = Inter({ subsets: ["latin"], weight: ["400", "700"] }); diff --git a/middleware.ts b/middleware.ts index c0bfb04..427f704 100644 --- a/middleware.ts +++ b/middleware.ts @@ -26,7 +26,7 @@ export const config = { "/Programas", "/Mensajes", "/Inscritos", - "/Inscripciones", + "/Inscripcion", "/InformacionEquipo", "/Impresiones", "/CambiarPass", diff --git a/public/IO.png b/public/IO.png new file mode 100644 index 0000000..526a868 Binary files /dev/null and b/public/IO.png differ diff --git a/public/SPAK.png b/public/SPAK.png new file mode 100644 index 0000000..3d68fda Binary files /dev/null and b/public/SPAK.png differ diff --git a/public/icon.svg b/public/icon.svg new file mode 100644 index 0000000..7c697cb --- /dev/null +++ b/public/icon.svg @@ -0,0 +1,2003 @@ + + + +