update: implemented static animations

groundbeeflover · groundbeeflover · commit 843821c9fff5 · 2025-07-06T14:21:26.000+02:00
diff --git a/blogs/UMDCTF2025.md b/blogs/UMDCTF2025.md
@@ -2,7 +2,7 @@
 title: "CTF Team UMDCTF Success!"
 date: 26-04-2025
 emoji: "🧠"
-description: "Embracing stillness in a world that glorifies busyness."
+description: "Our CTF team's recent performance and UMDCTF2025 was outstanding!"
 image: "hackathon_team.jpeg"
 ---
 
diff --git a/blogs/hackathondebut.md b/blogs/hackathondebut.md
@@ -2,7 +2,7 @@
 title: "Hackathon Team Debut!"
 date: 14-05-2025
 emoji: "🖥️"
-description: "Embracing stillness in a world that glorifies busyness."
+description: "Find out about our hackathon team's experience at their first ever event!"
 image: "hackathon_team.jpeg"
 ---
 
diff --git a/src/app/components/AnnouncementArticleList.tsx b/src/app/components/AnnouncementArticleList.tsx
@@ -8,7 +8,7 @@ export const AnnouncementArticleList = (props: ListProps) => {
     return (
         <div className="flex flex-col gap-2.5 text-lg items-center pb-5">
             {props.articles.map((article, id) => (
-                    <div className="py-1 max-w-3xl" key={id}>
+                    <div className="py-1 max-w-3xl grid-cols-1" key={id}>
                         <Link
                             href={`/Announcements/${article.id}`}
                             className="text-blue-900 hover:text-black
diff --git a/src/app/components/BlogArticleList.tsx b/src/app/components/BlogArticleList.tsx
@@ -8,7 +8,7 @@ export const BlogArticleList = (props: ListProps) => {
     return(
         <div className="flex flex-col gap-2.5 text-lg items-center pb-5">
             {props.articles.map((article, id) => (
-                <div key={id} className="max-w-3xl py-1 pl-5">
+                <div key={id} className="max-w-3xl py-1 pl-5 grid-cols-1">
                     <Link
                         href={`/Blog/${article.id}`}
                         className="text-blue-900 hover:text-black
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,36 +1,30 @@
-import "./globals.css";
-import type { Metadata } from 'next';
+"use client"
+import './globals.css';
+import { ReactNode } from 'react';
+import { AnimatePresence, motion } from 'framer-motion';
+import { usePathname } from 'next/navigation';
 
-/*
-const geistSans = Geist({
-  variable: "--font-geist-sans",
-  subsets: ["latin"],
-});
 
-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",
-  subsets: ["latin"],
-});
-*/
+export default function RootLayout({ children }: { children: ReactNode }) {
+  const pathname = usePathname();
 
-export const metadata: Metadata = {
-  title: "Maasec.com",
-  description: "Official website of ACM Student chapter MaaSec",
-};
-
-export default function RootLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
   return (
     <html lang="en">
       <body
         className={`font-mono antialiased`}
-
       >
-        {children}
+        <AnimatePresence mode="wait">
+          <motion.div
+            key={pathname}
+            initial={{ opacity: 0, y: 20 }}
+            animate={{ opacity: 1, y: 0 }}
+            exit={{ opacity: 0, y: -20 }}
+            transition={{ duration: 0.3 }}
+          >
+            {children}
+          </motion.div>
+        </AnimatePresence>
       </body>
     </html>
   );
-}
+}
diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -1,8 +1,16 @@
+
 import { /*useState, useEffect*/} from "react";
 import { Laptop, Lightbulb, Book, Monitor, Terminal,Users, Github} from "lucide-react";
 import Navbar from "../app/components/Navbar";
 import Image from "next/image";
 import Footer from "../app/components/Footer";
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Maasec.com",
+  description: "Official website of ACM Student chapter MaaSec",
+};
+
 
 export default function Home() {
   //const [_isMenuOpen, _setIsMenuOpen] = useState(false);
