v4.2.1/update-packages

next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package.json

@@ -17,7 +17,7 @@
   "dependencies": {
     "@cloudinary/url-gen": "^1.10.0",
     "@next/third-parties": "^14.2.5",
-    "@nextui-org/react": "^2.4.6",
+    "@nextui-org/react": "^2.6.8",
     "@nextui-org/shared-icons": "^2.0.9",
     "@types/node": "18.15.11",
     "@types/react": "18.0.35",
@@ -27,19 +27,17 @@
     "framer-motion": "^11.3.31",
     "gts": "^5.3.1",
     "lucide-react": "^0.437.0",
-    "next": "^13.5.6",
+    "next": "^15.1.2",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-simple-typewriter": "^5.0.1",
     "typescript": "5.0.4",
     "usehooks-ts": "^3.1.0"
   },
   "devDependencies": {
-    "@types/node": "20.12.7",
     "autoprefixer": "^10.4.20",
     "gts": "^5.3.1",
     "postcss": "^8.4.41",
-    "tailwindcss": "^3.4.10",
-    "typescript": "^5.4.3"
+    "tailwindcss": "^3.4.10"
   }
 }

src/app/(main)/layout.tsx

@@ -43,7 +43,7 @@ export default function MainLayout({
     <main className="flex justify-center items-center min-h-screen">
       <motion.div
         ref={scope}
-        className="absolute inset-0 bg-grid"
+        className="fixed inset-0 bg-grid"
         animate={{
           maskPosition:
             isClient && isPositionInitialized && width > 768

src/app/layout.tsx

@@ -3,11 +3,11 @@ import './global.css';
 import { Providers } from './providers';
 import { Inter } from 'next/font/google';
 import { clsx } from '@nextui-org/shared-utils';
+import { Viewport } from 'next';
 
 export const metadata = {
   title: 'Oleh Proidakov',
   description: 'Hi! My name is Oleh.',
-  themeColor: '#000000',
   icons: {
     icon: [
       {
@@ -37,6 +37,10 @@ export const metadata = {
   },
 };
 
+export const viewport: Viewport = {
+  themeColor: '#000000',
+};
+
 const inter = Inter({
   subsets: ['latin'],
   display: 'swap',

tailwind.config.js

@@ -7,7 +7,11 @@ const config = {
     './node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}',
   ],
   theme: {
-    extend: {},
+    extend: {
+      minHeight: {
+        screen: ['100vh', '100svh'],
+      },
+    },
   },
   darkMode: 'class',
   plugins: [nextui()],