diff --git a/.gitattributes b/.gitattributes index 9c45f0df..1629cb13 100644 --- a/.gitattributes +++ b/.gitattributes @@ -3,7 +3,9 @@ # The above only works properly for Git 2.10+, so for older versions # we need to manually list the binary files we don't want modified. *.ico binary -*.jpg binary *.jpeg binary +*.jpg binary *.png binary *.ttf binary +*.woff binary +*.woff2 binary diff --git a/.prettierrc b/.prettierrc index 4bbbd40f..cedfad64 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,8 +1,5 @@ { - "plugins": [ - "prettier-plugin-jsdoc", - "@trivago/prettier-plugin-sort-imports" - ], + "plugins": ["prettier-plugin-jsdoc", "@trivago/prettier-plugin-sort-imports"], "trailingComma": "es5", "bracketSpacing": true, "bracketSameLine": false, @@ -22,22 +19,10 @@ "htmlWhitespaceSensitivity": "css", "embeddedLanguageFormatting": "auto", "importOrderSeparation": false, - "importOrder": [ - "", - "^[./]", - "", - "^[./]" - ], + "importOrder": ["", "^[./]", "", "^[./]"], "overrides": [ { - "files": [ - "*.yaml", - "*.yml", - "*.json", - "*.config.{js,ts}", - "*rc", - "*rc.{js,ts}" - ], + "files": ["*.yaml", "*.yml", "*.json", "*.config.{js,ts}", "*rc", "*rc.{js,ts}"], "options": { "tabWidth": 2 } diff --git a/package.json b/package.json index 70640183..edf2f26f 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,8 @@ "dependencies": { "next": "14.0.3", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "react-icons": "^4.12.0" }, "devDependencies": { "@trivago/prettier-plugin-sort-imports": "^4.3.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a4d249e8..6adef9d5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -14,6 +14,9 @@ dependencies: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) + react-icons: + specifier: ^4.12.0 + version: 4.12.0(react@18.2.0) devDependencies: '@trivago/prettier-plugin-sort-imports': @@ -4448,6 +4451,17 @@ packages: scheduler: 0.23.0 dev: false + /react-icons@4.12.0(react@18.2.0): + resolution: + { + integrity: sha512-IBaDuHiShdZqmfc/TwHu6+d6k2ltNCf3AszxNmjJc1KUfXdEeRJOKyNvLmAHaarhzGmTSVygNdyu8/opXv2gaw==, + } + peerDependencies: + react: '*' + dependencies: + react: 18.2.0 + dev: false + /react-is@16.13.1: resolution: { diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 00000000..09130252 Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/images/cyberPanel.jpg b/public/images/cyberPanel.jpg new file mode 100644 index 00000000..c6a2027a Binary files /dev/null and b/public/images/cyberPanel.jpg differ diff --git a/public/images/duckCTF.jpg b/public/images/duckCTF.jpg new file mode 100644 index 00000000..7f5373ad Binary files /dev/null and b/public/images/duckCTF.jpg differ diff --git a/public/images/logo.png b/public/images/logo.png new file mode 100644 index 00000000..220f18cb Binary files /dev/null and b/public/images/logo.png differ diff --git a/public/images/pizza.jpg b/public/images/pizza.jpg new file mode 100644 index 00000000..990f93a9 Binary files /dev/null and b/public/images/pizza.jpg differ diff --git a/public/images/rectangleGrid.svg b/public/images/rectangleGrid.svg new file mode 100644 index 00000000..d105e346 --- /dev/null +++ b/public/images/rectangleGrid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/images/squareGrid.svg b/public/images/squareGrid.svg new file mode 100644 index 00000000..a890787e --- /dev/null +++ b/public/images/squareGrid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/images/whiteDuck.svg b/public/images/whiteDuck.svg new file mode 100644 index 00000000..267942dd --- /dev/null +++ b/public/images/whiteDuck.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/images/whiteDuckOutline.svg b/public/images/whiteDuckOutline.svg new file mode 100644 index 00000000..f4b0edf3 --- /dev/null +++ b/public/images/whiteDuckOutline.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/images/yellowStar.svg b/public/images/yellowStar.svg new file mode 100644 index 00000000..2e44f925 --- /dev/null +++ b/public/images/yellowStar.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/images/yellowTriangle.svg b/public/images/yellowTriangle.svg new file mode 100644 index 00000000..3f8d3313 --- /dev/null +++ b/public/images/yellowTriangle.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/logo/logo-text.svg b/public/logo/logo-text.svg new file mode 100644 index 00000000..e402d109 --- /dev/null +++ b/public/logo/logo-text.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/logo/logo.svg b/public/logo/logo.svg new file mode 100644 index 00000000..c7895724 --- /dev/null +++ b/public/logo/logo.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/public/next.svg b/public/next.svg deleted file mode 100644 index 5174b28c..00000000 --- a/public/next.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/vercel.svg b/public/vercel.svg deleted file mode 100644 index d2f84222..00000000 --- a/public/vercel.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/app/(home)/ImageCarousel.tsx b/src/app/(home)/ImageCarousel.tsx new file mode 100644 index 00000000..704032e9 --- /dev/null +++ b/src/app/(home)/ImageCarousel.tsx @@ -0,0 +1,67 @@ +'use client'; + +import FancyRectangle from '@/components/FancyRectangle'; +import Image from 'next/image'; +import { useState, useEffect } from 'react'; + +interface CarouselImage { + src: string; + alt: string; +} + +const images: CarouselImage[] = [ + { + src: '/images/duckCTF.jpg', + alt: 'DuckCTF', + }, + { + src: '/images/pizza.jpg', + alt: 'Pizza', + }, + { + src: '/images/cyberPanel.jpg', + alt: 'Cyber Panel', + }, +]; + +export default function ImageCarousel() { + const [currentImageIndex, setCurrentImageIndex] = useState(0); + const [isTransitioning, setIsTransitioning] = useState(false); + + const goToNextImage = () => { + setIsTransitioning(true); + setTimeout(() => { + setCurrentImageIndex((prevIndex) => + prevIndex === images.length - 1 ? 0 : prevIndex + 1 + ); + setIsTransitioning(false); + }, 500); + }; + + useEffect(() => { + const interval = setInterval(goToNextImage, 5000); // Change image every 5 seconds + return () => clearInterval(interval); + }, []); + + return ( +
+ +
+
+ {images[currentImageIndex].alt} +
+
+ +
+ ); +} diff --git a/src/app/(home)/layout.tsx b/src/app/(home)/layout.tsx new file mode 100644 index 00000000..8c17d772 --- /dev/null +++ b/src/app/(home)/layout.tsx @@ -0,0 +1,12 @@ +import Footer from '@/components/Footer'; +import Header from '@/components/Header'; + +export default function HomeLayout({ children }: RootLayoutProps) { + return ( + <> +
+ {children} +