This is based on Next.js.. we can get jos working but have you looke

So yeah... It works now... <div class="highlight highlight-source-js notranslate p

JOS-Next.js implementation about frontend HOT 1 CLOSED

jesvijonathan commented on July 21, 2024

JOS-Next.js implementation

from frontend.

Comments (1)

jesvijonathan commented on July 21, 2024

So yeah... It works now...

"use client";

import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "./globals.css";
import NavBar from "@/components/NavBar";

import { useEffect, useState } from "react";
import jos from "jos-animation";

const inter = Inter({ subsets: ["latin"] });

// Had to comment below code because of error | metadata is not defined
// export const metadata: Metadata = {
//   title: "CIT - Takshashila 2024",
//   description:
//     "Takshashila, an event organized In regards to annual cultural event conducted in Chennai Institute Of Technology.",
// };

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  const jos_options = {
    debugMode: false,
    passive: true,
    animation: "fade",
    duration: 0.4,
    rootMargin: "20% 0% 30% 0%",
  };

  useEffect(() => {
    jos.init(jos_options);
  }, []);

  useEffect(() => {
    jos.refresh();
  });

  return (
    <html lang="en">
      <body className={inter.className}>
        <NavBar />
        {children}
      </body>
    </html>
  );
}