Mainsite/feature/projects page

apps/main/src/app/lib/Components/NavBar.tsx

@@ -1,15 +1,26 @@
 "use client";
 
 import React from "react";
-// import LocalLink from "./LocalLink";
+import LocalLink from "./LocalLink";
 // import HomeIcon from "@repo/ui/Icons/HomeIcon";
 // import Hamburger from "hamburger-react";
 
 const NavBar = () => {
   // const [isOpen, setOpen] = useState(false);
   // const isMobile = useIsMobileLgScreen();
 
-  return <div className="sticky top-0 z-[50] w-full"></div>;
+  return (
+    <div className="sticky top-0 z-[50] w-full">
+      <div className="bg-white flex flex-row w-full h-full justify-between align-middle drop-shadow-xl">
+        <LocalLink
+          href={"/projects"}
+          className="text-xl flex items-center px-5"
+        >
+          Projects
+        </LocalLink>
+      </div>
+    </div>
+  );
 };
 
 export default NavBar;

apps/main/src/app/projects/components/background.tsx

@@ -0,0 +1,203 @@
+import React from "react";
+
+type ProjectBackgroundProps = {
+  className?: string;
+};
+
+const ProjectBackground: React.FC<ProjectBackgroundProps> = ({ className }) => {
+  return (
+    <svg
+      className={className}
+      preserveAspectRatio="none"
+      width={className ? undefined : "2000"}
+      height={className ? undefined : "5513"}
+      viewBox="0 0 2000 5513"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_1_255)">
+        <rect width="2000" height="5513" fill="white" />
+        <rect width="2000" height="5513" fill="url(#paint0_linear_1_255)" />
+        <g style={{ mixBlendMode: "screen" }} opacity={0.03}>
+          <path
+            d="M1003.26 3149.1L882.112 -420.914H1117.7L1003.26 3149.1Z"
+            fill="white"
+          />
+          <path
+            d="M947.37 3145.23L1386.19 -399.783L1618.87 -362.93L947.37 3145.23Z"
+            fill="white"
+          />
+          <path
+            d="M892.775 3132.66L1880.75 -300.058L2104.81 -227.258L892.775 3132.66Z"
+            fill="white"
+          />
+          <path
+            d="M840.818 3111.71L2353.63 -124.193L2563.54 -17.2399L840.818 3111.71Z"
+            fill="white"
+          />
+          <path
+            d="M792.778 3082.89L2793.17 123.48L2983.76 261.954L792.778 3082.89Z"
+            fill="white"
+          />
+          <path
+            d="M749.838 3046.91L3188.56 436.864L3355.14 603.448L749.838 3046.91Z"
+            fill="white"
+          />
+          <path
+            d="M713.056 3004.65L3530.05 808.242L3668.52 998.834L713.056 3004.65Z"
+            fill="white"
+          />
+          <path
+            d="M683.336 2957.16L3809.24 1228.47L3916.2 1438.38L683.336 2957.16Z"
+            fill="white"
+          />
+          <path
+            d="M661.412 2905.61L4019.26 1687.2L4092.06 1911.25L661.412 2905.61Z"
+            fill="white"
+          />
+          <path
+            d="M647.823 2851.26L4154.93 2173.13L4191.79 2405.82L647.823 2851.26Z"
+            fill="white"
+          />
+          <path
+            d="M642.903 2795.45L4212.92 2674.31V2909.89L642.903 2795.45Z"
+            fill="white"
+          />
+          <path
+            d="M646.773 2739.57L4191.79 3178.38L4154.93 3411.07L646.773 2739.57Z"
+            fill="white"
+          />
+          <path
+            d="M659.339 2684.97L4092.06 3672.95L4019.26 3897L659.339 2684.97Z"
+            fill="white"
+          />
+          <path
+            d="M680.291 2633.01L3916.2 4145.82L3809.24 4355.73L680.291 2633.01Z"
+            fill="white"
+          />
+          <path
+            d="M709.112 2584.97L3668.52 4585.37L3530.05 4775.96L709.112 2584.97Z"
+            fill="white"
+          />
+          <path
+            d="M745.094 2542.03L3355.14 4980.75L3188.56 5147.33L745.094 2542.03Z"
+            fill="white"
+          />
+          <path
+            d="M787.35 2505.25L2983.76 5322.25L2793.17 5460.72L787.35 2505.25Z"
+            fill="white"
+          />
+          <path
+            d="M834.84 2475.53L2563.54 5601.44L2353.63 5708.39L834.84 2475.53Z"
+            fill="white"
+          />
+          <path
+            d="M886.394 2453.61L2104.81 5811.46L1880.75 5884.26L886.394 2453.61Z"
+            fill="white"
+          />
+          <path
+            d="M940.744 2440.02L1618.87 5947.13L1386.19 5983.98L940.744 2440.02Z"
+            fill="white"
+          />
+          <path
+            d="M996.55 2435.1L1117.7 6005.11H882.111L996.55 2435.1Z"
+            fill="white"
+          />
+          <path
+            d="M1052.44 2438.97L613.62 5983.98L380.936 5947.13L1052.44 2438.97Z"
+            fill="white"
+          />
+          <path
+            d="M1107.03 2451.53L119.056 5884.26L-104.999 5811.46L1107.03 2451.53Z"
+            fill="white"
+          />
+          <path
+            d="M1158.99 2472.49L-353.82 5708.39L-563.727 5601.44L1158.99 2472.49Z"
+            fill="white"
+          />
+          <path
+            d="M1207.03 2501.31L-793.362 5460.72L-983.954 5322.25L1207.03 2501.31Z"
+            fill="white"
+          />
+          <path
+            d="M1249.97 2537.29L-1188.75 5147.33L-1355.33 4980.75L1249.97 2537.29Z"
+            fill="white"
+          />
+          <path
+            d="M1286.75 2579.55L-1530.24 4775.96L-1668.72 4585.36L1286.75 2579.55Z"
+            fill="white"
+          />
+          <path
+            d="M1316.47 2627.04L-1809.44 4355.73L-1916.39 4145.82L1316.47 2627.04Z"
+            fill="white"
+          />
+          <path
+            d="M1338.4 2678.59L-2019.45 3897L-2092.25 3672.95L1338.4 2678.59Z"
+            fill="white"
+          />
+          <path
+            d="M1351.99 2732.94L-2155.13 3411.07L-2191.98 3178.38L1351.99 2732.94Z"
+            fill="white"
+          />
+          <path
+            d="M1356.91 2788.74L-2213.11 2909.89L-2213.11 2674.31L1356.91 2788.74Z"
+            fill="white"
+          />
+          <path
+            d="M1353.03 2844.63L-2191.98 2405.82L-2155.13 2173.13L1353.03 2844.63Z"
+            fill="white"
+          />
+          <path
+            d="M1340.47 2899.23L-2092.25 1911.25L-2019.45 1687.2L1340.47 2899.23Z"
+            fill="white"
+          />
+          <path
+            d="M1319.52 2951.19L-1916.39 1438.37L-1809.43 1228.47L1319.52 2951.19Z"
+            fill="white"
+          />
+          <path
+            d="M1290.7 2999.23L-1668.71 998.833L-1530.24 808.241L1290.7 2999.23Z"
+            fill="white"
+          />
+          <path
+            d="M1254.71 3042.17L-1355.33 603.447L-1188.75 436.863L1254.71 3042.17Z"
+            fill="white"
+          />
+          <path
+            d="M1212.46 3078.95L-983.953 261.953L-793.361 123.48L1212.46 3078.95Z"
+            fill="white"
+          />
+          <path
+            d="M1164.97 3108.67L-563.727 -17.2399L-353.82 -124.193L1164.97 3108.67Z"
+            fill="white"
+          />
+          <path
+            d="M1113.41 3130.59L-104.999 -227.258L119.056 -300.058L1113.41 3130.59Z"
+            fill="white"
+          />
+          <path
+            d="M1059.06 3144.18L380.936 -362.93L613.621 -399.783L1059.06 3144.18Z"
+            fill="white"
+          />
+        </g>
+      </g>
+      <defs>
+        <linearGradient
+          id="paint0_linear_1_255"
+          x1="1000"
+          y1="0"
+          x2="1000"
+          y2="5513"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#173C62" />
+          <stop offset="1" stopColor="#3A6490" />
+        </linearGradient>
+        <clipPath id="clip0_1_255">
+          <rect width="2000" height="5513" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+};
+export default ProjectBackground;