marketing updates for the website

frontend/apps/artcraft-website/src/pages/landing2/landing2.tsx

@@ -181,6 +181,250 @@ const Landing = () => {
         </div>
       </main>
 
+      <div className="relative flex overflow-visible xl:items-center xl:pt-0 mb-4 md:mb-12 px-2 sm:px-4 md:px-0">
+        {/* Gradient Orb for Section */}
+        <div className="absolute left-[-200px] top-[-100px] w-[600px] h-[600px] rounded-full bg-gradient-to-br from-[#00AABA] via-blue-500 to-blue-700 opacity-15 blur-[120px] z-0 pointer-events-none" />
+        <motion.div
+          className="w-full flex flex-col items-center justify-center text-center pt-16 sm:pt-24 md:pt-32 px-2 sm:px-6 md:px-10"
+          initial="hidden"
+          whileInView="visible"
+          viewport={{ once: true }}
+          variants={fadeUpVariants}
+        >
+          <motion.div className="relative" variants={fadeUpVariants}>
+            <h1 className="relative mb-4 sm:mb-6 md:mb-10 font-bold text-3xl sm:text-4xl md:text-[3rem] lg:text-[4rem] xl:text-[5rem] !leading-none text-shadow-lg">
+              <span
+                className="text-primary"
+                style={{ textShadow: "0 0 15px var(--color-primary)" }}
+              >
+                Four Reasons
+              </span>
+              &nbsp;Why ArtCraft is the&nbsp;
+              <span
+                className="text-primary"
+                style={{ textShadow: "0 0 15px var(--color-primary)" }}
+              >
+                Best Tool
+              </span>
+            </h1>
+          </motion.div>
+        </motion.div>
+      </div>
+
+      <div className="overflow-visible py-10 sm:py-20 md:py-28 lg:py-32 relative px-4">
+        {/* Gradient Orb for Section */}
+        <div className="absolute left-[-150px] bottom-[-100px] w-[500px] h-[500px] rounded-full bg-gradient-to-br from-[#00AABA] via-blue-500 to-blue-700 opacity-10 blur-[110px] z-0 pointer-events-none" />
+        <motion.div
+          className="mx-auto max-w-[88rem] md:px-6 lg:px-8"
+          initial="hidden"
+          whileInView="visible"
+          viewport={{ once: true }}
+          variants={fadeUpVariants}
+        >
+          <div className="grid grid-cols-1 gap-10 sm:gap-20 lg:grid-cols-2 lg:items-center">
+            <motion.div
+              className="px-2 sm:px-6 lg:px-0 lg:pt-4 lg:pr-4"
+              variants={fadeUpVariants}
+            >
+              <div className="max-w-2xl lg:mx-0 mb-10 md:mb-16">
+                <h2 className="relative font-bold text-4xl md:text-5xl lg:text-6xl !leading-tight">
+                  Reason #1. Text Prompting Sucks {" "}
+                  <span className="text-primary">Our tool lets you design visually, like Figma. It's as if you're playing a video game.</span>
+                </h2>
+              </div>
+              <DiscordButton />
+            </motion.div>
+            <div className="sm:px-2 sm:mx-auto lg:px-0">
+              <div className="relative isolate overflow-hidden bg-indigo-500 sm:mx-auto sm:max-w-2xl sm:rounded-3xl sm:pr-0 lg:mx-0 lg:max-w-none">
+                <div className="mx-auto max-w-full sm:max-w-2xl sm:mx-0 sm:max-w-none p-2 sm:p-4 bg-white/10 backdrop-blur-md rounded-2xl sm:rounded-3xl overflow-hidden shadow-2xl">
+                  <video
+                    src="/videos/artcraft-3d-demo.mp4"
+                    autoPlay
+                    muted
+                    loop
+                    playsInline
+                    className="aspect-square w-full max-w-none rounded-lg bg-gray-800 object-cover h-full overflow-hidden"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </motion.div>
+      </div>
+
+
+      <div className="overflow-visible py-10 sm:py-20 md:py-28 lg:py-32 relative px-4">
+        {/* Gradient Orb for Section */}
+        <div className="absolute right-[-200px] top-[-100px] w-[600px] h-[600px] rounded-full bg-gradient-to-br from-blue-700 via-[#00AABA] to-pink-500 opacity-10 blur-[120px] z-0 pointer-events-none" />
+        <motion.div
+          className="mx-auto max-w-[88rem] md:px-6 lg:px-8"
+          initial="hidden"
+          whileInView="visible"
+          viewport={{ once: true }}
+          variants={fadeUpVariants}
+        >
+          <div className="grid grid-cols-1 gap-10 sm:gap-20 lg:grid-cols-2 lg:items-center">
+            <div className="sm:px-2 sm:mx-auto lg:px-0 order-2 lg:order-1">
+              <motion.div
+                className="relative isolate overflow-hidden bg-indigo-500 sm:mx-auto sm:max-w-2xl sm:rounded-3xl sm:pr-0 lg:mx-0 lg:max-w-none"
+                variants={fadeUpVariants}
+              >
+                <div className="mx-auto max-w-full sm:max-w-2xl sm:mx-0 sm:max-w-none p-2 sm:p-4 bg-white/10 backdrop-blur-md rounded-2xl sm:rounded-3xl overflow-hidden shadow-2xl">
+                  <video
+                    src="/videos/artcraft-canvas-demo.mp4"
+                    autoPlay
+                    muted
+                    loop
+                    playsInline
+                    className="aspect-square w-full max-w-none rounded-lg bg-gray-800 object-cover h-full overflow-hidden"
+                  />
+                </div>
+              </motion.div>
+            </div>
+            <motion.div
+              className="px-2 sm:px-6 lg:px-0 lg:pt-4 lg:pr-4 order-1 lg:order-2"
+              variants={fadeUpVariants}
+            >
+              <div className=" max-w-2xl lg:mx-0 mb-10 md:mb-16">
+                <h2 className="relative font-bold text-4xl md:text-5xl lg:text-6xl xl:text-[3.8rem] !leading-tight">
+                  Reason #2. You'll be able to use EVERY (we mean EVERY) image and video model all in one place. You can log into your existing subscriptions and use them all in ArtCraft.
+                </h2>
+              </div>
+              <DiscordButton />
+            </motion.div>
+          </div>
+        </motion.div>
+      </div>
+
+
+      <div className="overflow-visible py-10 sm:py-20 md:py-28 lg:py-32 relative px-4">
+        {/* Gradient Orb for Section */}
+        <div className="absolute left-[-150px] bottom-[-100px] w-[500px] h-[500px] rounded-full bg-gradient-to-br from-[#00AABA] via-blue-500 to-blue-700 opacity-10 blur-[110px] z-0 pointer-events-none" />
+        <motion.div
+          className="mx-auto max-w-[88rem] md:px-6 lg:px-8"
+          initial="hidden"
+          whileInView="visible"
+          viewport={{ once: true }}
+          variants={fadeUpVariants}
+        >
+          <div className="grid grid-cols-1 gap-10 sm:gap-20 lg:grid-cols-2 lg:items-center">
+            <motion.div
+              className="px-2 sm:px-6 lg:px-0 lg:pt-4 lg:pr-4"
+              variants={fadeUpVariants}
+            >
+              <div className="max-w-2xl lg:mx-0 mb-10 md:mb-16">
+                <h2 className="relative font-bold text-4xl md:text-5xl lg:text-6xl !leading-tight">
+                  Reason #3. It's a Desktop App
+                  <span className="text-primary">No more hunting for the hundreth tab. This app works on Windows, Mac, and soon Linux and Tablets. It's a first class experience for real artists.</span>
+                </h2>
+              </div>
+              <DiscordButton />
+            </motion.div>
+            <div className="sm:px-2 sm:mx-auto lg:px-0">
+              <div className="relative isolate overflow-hidden bg-indigo-500 sm:mx-auto sm:max-w-2xl sm:rounded-3xl sm:pr-0 lg:mx-0 lg:max-w-none">
+                <div className="mx-auto max-w-full sm:max-w-2xl sm:mx-0 sm:max-w-none p-2 sm:p-4 bg-white/10 backdrop-blur-md rounded-2xl sm:rounded-3xl overflow-hidden shadow-2xl">
+                  <video
+                    src="/videos/artcraft-3d-demo.mp4"
+                    autoPlay
+                    muted
+                    loop
+                    playsInline
+                    className="aspect-square w-full max-w-none rounded-lg bg-gray-800 object-cover h-full overflow-hidden"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </motion.div>
+      </div>
+
+
+      <div className="overflow-visible py-10 sm:py-20 md:py-28 lg:py-32 relative px-4">
+        {/* Gradient Orb for Section */}
+        <div className="absolute right-[-200px] top-[-100px] w-[600px] h-[600px] rounded-full bg-gradient-to-br from-blue-700 via-[#00AABA] to-pink-500 opacity-10 blur-[120px] z-0 pointer-events-none" />
+        <motion.div
+          className="mx-auto max-w-[88rem] md:px-6 lg:px-8"
+          initial="hidden"
+          whileInView="visible"
+          viewport={{ once: true }}
+          variants={fadeUpVariants}
+        >
+          <div className="grid grid-cols-1 gap-10 sm:gap-20 lg:grid-cols-2 lg:items-center">
+            <div className="sm:px-2 sm:mx-auto lg:px-0 order-2 lg:order-1">
+              <motion.div
+                className="relative isolate overflow-hidden bg-indigo-500 sm:mx-auto sm:max-w-2xl sm:rounded-3xl sm:pr-0 lg:mx-0 lg:max-w-none"
+                variants={fadeUpVariants}
+              >
+                <div className="mx-auto max-w-full sm:max-w-2xl sm:mx-0 sm:max-w-none p-2 sm:p-4 bg-white/10 backdrop-blur-md rounded-2xl sm:rounded-3xl overflow-hidden shadow-2xl">
+                  <video
+                    src="/videos/artcraft-canvas-demo.mp4"
+                    autoPlay
+                    muted
+                    loop
+                    playsInline
+                    className="aspect-square w-full max-w-none rounded-lg bg-gray-800 object-cover h-full overflow-hidden"
+                  />
+                </div>
+              </motion.div>
+            </div>
+            <motion.div
+              className="px-2 sm:px-6 lg:px-0 lg:pt-4 lg:pr-4 order-1 lg:order-2"
+              variants={fadeUpVariants}
+            >
+              <div className=" max-w-2xl lg:mx-0 mb-10 md:mb-16">
+                <h2 className="relative font-bold text-4xl md:text-5xl lg:text-6xl xl:text-[3.8rem] !leading-tight">
+
+                  Reason #4. It's Open Source
+                  We'll be releasing the code behind our desktop app, server, models, and infrastructure as open source. You own this!
+                </h2>
+              </div>
+              <DiscordButton />
+            </motion.div>
+          </div>
+        </motion.div>
+      </div>
+
+      <div className="overflow-visible py-10 sm:py-20 md:py-28 lg:py-32 relative px-4">
+        {/* Gradient Orb for Section */}
+        <div className="absolute left-[-150px] bottom-[-100px] w-[500px] h-[500px] rounded-full bg-gradient-to-br from-[#00AABA] via-blue-500 to-blue-700 opacity-10 blur-[110px] z-0 pointer-events-none" />
+        <motion.div
+          className="mx-auto max-w-[88rem] md:px-6 lg:px-8"
+          initial="hidden"
+          whileInView="visible"
+          viewport={{ once: true }}
+          variants={fadeUpVariants}
+        >
+          <div className="grid grid-cols-1 gap-10 sm:gap-20 lg:grid-cols-2 lg:items-center">
+            <motion.div
+              className="px-2 sm:px-6 lg:px-0 lg:pt-4 lg:pr-4"
+              variants={fadeUpVariants}
+            >
+              <div className="max-w-2xl lg:mx-0 mb-10 md:mb-16">
+                <h2 className="relative font-bold text-4xl md:text-5xl lg:text-6xl !leading-tight">
+                  Reason #5. Artcraft was created by artists and filmmakers.
+                  <span className="text-primary">The other leading platforms were created by the Google ad team, crypto bros, and other non-artists. Not us. We're one of you.</span>
+                </h2>
+              </div>
+              <DiscordButton />
+            </motion.div>
+            <div className="sm:px-2 sm:mx-auto lg:px-0">
+              <div className="relative isolate overflow-hidden bg-indigo-500 sm:mx-auto sm:max-w-2xl sm:rounded-3xl sm:pr-0 lg:mx-0 lg:max-w-none">
+                <div className="mx-auto max-w-full sm:max-w-2xl sm:mx-0 sm:max-w-none p-2 sm:p-4 bg-white/10 backdrop-blur-md rounded-2xl sm:rounded-3xl overflow-hidden shadow-2xl">
+                  <video
+                    src="/videos/artcraft-3d-demo.mp4"
+                    autoPlay
+                    muted
+                    loop
+                    playsInline
+                    className="aspect-square w-full max-w-none rounded-lg bg-gray-800 object-cover h-full overflow-hidden"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </motion.div>
+      </div>
+
       <div className="relative flex overflow-visible xl:items-center xl:pt-0 mb-4 md:mb-12 px-2 sm:px-4 md:px-0">
         {/* Gradient Orb for Section */}
         <div className="absolute left-[-200px] top-[-100px] w-[600px] h-[600px] rounded-full bg-gradient-to-br from-[#00AABA] via-blue-500 to-blue-700 opacity-15 blur-[120px] z-0 pointer-events-none" />
@@ -247,6 +491,32 @@ const Landing = () => {
         </motion.div>
       </div>
 
+
+      <div className="relative flex overflow-visible xl:items-center xl:pt-0 mb-4 md:mb-12 px-2 sm:px-4 md:px-0">
+        {/* Gradient Orb for Section */}
+        <div className="absolute left-[-200px] top-[-100px] w-[600px] h-[600px] rounded-full bg-gradient-to-br from-[#00AABA] via-blue-500 to-blue-700 opacity-15 blur-[120px] z-0 pointer-events-none" />
+        <motion.div
+          className="w-full flex flex-col items-center justify-center text-center pt-16 sm:pt-24 md:pt-32 px-2 sm:px-6 md:px-10"
+          initial="hidden"
+          whileInView="visible"
+          viewport={{ once: true }}
+          variants={fadeUpVariants}
+        >
+          <motion.div className="relative" variants={fadeUpVariants}>
+            <h1 className="relative mb-4 sm:mb-6 md:mb-10 font-bold text-3xl sm:text-4xl md:text-[3rem] lg:text-[4rem] xl:text-[5rem] !leading-none text-shadow-lg">
+              <span
+                className="text-primary"
+                style={{ textShadow: "0 0 15px var(--color-primary)" }}
+              >
+                Again &mdash; We're Pulling You Out of Prompting
+              </span>
+            </h1>
+          </motion.div>
+        </motion.div>
+      </div>
+
+
+
       <div className="overflow-visible py-10 sm:py-20 md:py-28 lg:py-32 relative px-4">
         {/* Gradient Orb for Section */}
         <div className="absolute left-[-150px] bottom-[-100px] w-[500px] h-[500px] rounded-full bg-gradient-to-br from-[#00AABA] via-blue-500 to-blue-700 opacity-10 blur-[110px] z-0 pointer-events-none" />

frontend/apps/editor3d/tsconfig.json

@@ -28,6 +28,9 @@
     "noEmit": true
   },
   "references": [
+    {
+      "path": "../../libs/model-list"
+    },
     {
       "path": "../../libs/components/pagination"
     },
@@ -73,6 +76,9 @@
     {
       "path": "../../libs/components/toaster"
     },
+    {
+      "path": "../../libs/components/login-modal"
+    },
     {
       "path": "../../libs/components/model-selector"
     },
@@ -82,9 +88,6 @@
     {
       "path": "../../libs/components/promptbox"
     },
-    {
-      "path": "../../libs/tauri-api"
-    },
     {
       "path": "../../libs/components/popover"
     },
@@ -94,9 +97,6 @@
     {
       "path": "../../libs/components/menu-icon-selector"
     },
-    {
-      "path": "../../libs/api"
-    },
     {
       "path": "../../libs/components/tooltip"
     },
@@ -109,9 +109,6 @@
     {
       "path": "../../libs/components/gravatar"
     },
-    {
-      "path": "../../libs/components/login-modal"
-    },
     {
       "path": "../../libs/components/select"
     },
@@ -139,8 +136,14 @@
     {
       "path": "../../libs/components/button"
     },
+    {
+      "path": "../../libs/tauri-api"
+    },
     {
       "path": "../../libs/tauri-utils"
+    },
+    {
+      "path": "../../libs/api"
     }
   ]
 }

frontend/libs/components/login-modal/tsconfig.json

@@ -8,9 +8,6 @@
     {
       "path": "../../tauri-api"
     },
-    {
-      "path": "../../tauri-utils"
-    },
     {
       "path": "../button"
     },

frontend/libs/components/login-modal/tsconfig.lib.json

@@ -49,9 +49,6 @@
     {
       "path": "../../tauri-api/tsconfig.lib.json"
     },
-    {
-      "path": "../../tauri-utils/tsconfig.lib.json"
-    },
     {
       "path": "../button/tsconfig.lib.json"
     },

frontend/libs/components/pricing-modal/tsconfig.json

@@ -2,6 +2,9 @@
   "files": [],
   "include": [],
   "references": [
+    {
+      "path": "../tab-selector"
+    },
     {
       "path": "../button"
     },

frontend/libs/components/pricing-modal/tsconfig.lib.json

@@ -43,6 +43,9 @@
     "src/**/*.tsx"
   ],
   "references": [
+    {
+      "path": "../tab-selector/tsconfig.lib.json"
+    },
     {
       "path": "../button/tsconfig.lib.json"
     },

frontend/libs/components/promptbox/tsconfig.json

@@ -2,14 +2,17 @@
   "files": [],
   "include": [],
   "references": [
+    {
+      "path": "../../model-list"
+    },
     {
       "path": "../camera-settings-modal"
     },
     {
-      "path": "../action-reminder-modal"
+      "path": "../../soundboard"
     },
     {
-      "path": "../../soundboard"
+      "path": "../action-reminder-modal"
     },
     {
       "path": "../../tauri-api"

frontend/libs/components/promptbox/tsconfig.lib.json

@@ -43,14 +43,17 @@
     "src/**/*.tsx"
   ],
   "references": [
+    {
+      "path": "../../model-list/tsconfig.lib.json"
+    },
     {
       "path": "../camera-settings-modal/tsconfig.lib.json"
     },
     {
-      "path": "../action-reminder-modal/tsconfig.lib.json"
+      "path": "../../soundboard/tsconfig.lib.json"
     },
     {
-      "path": "../../soundboard/tsconfig.lib.json"
+      "path": "../action-reminder-modal/tsconfig.lib.json"
     },
     {
       "path": "../../tauri-api/tsconfig.lib.json"

frontend/libs/components/settings-modal/tsconfig.json

@@ -5,9 +5,6 @@
     {
       "path": "../modal"
     },
-    {
-      "path": "../label"
-    },
     {
       "path": "../switch"
     },
@@ -18,7 +15,7 @@
       "path": "../../soundboard"
     },
     {
-      "path": "../../tauri-api"
+      "path": "../login-modal"
     },
     {
       "path": "../../api"
@@ -29,6 +26,12 @@
     {
       "path": "../button"
     },
+    {
+      "path": "../label"
+    },
+    {
+      "path": "../../tauri-api"
+    },
     {
       "path": "./tsconfig.lib.json"
     },

frontend/libs/components/settings-modal/tsconfig.lib.json

@@ -46,9 +46,6 @@
     {
       "path": "../modal/tsconfig.lib.json"
     },
-    {
-      "path": "../label/tsconfig.lib.json"
-    },
     {
       "path": "../switch/tsconfig.lib.json"
     },
@@ -59,7 +56,7 @@
       "path": "../../soundboard/tsconfig.lib.json"
     },
     {
-      "path": "../../tauri-api/tsconfig.lib.json"
+      "path": "../login-modal/tsconfig.lib.json"
     },
     {
       "path": "../../api/tsconfig.lib.json"
@@ -69,6 +66,12 @@
     },
     {
       "path": "../button/tsconfig.lib.json"
+    },
+    {
+      "path": "../label/tsconfig.lib.json"
+    },
+    {
+      "path": "../../tauri-api/tsconfig.lib.json"
     }
   ]
 }

frontend/package-lock.json

@@ -4327,7 +4327,7 @@
       "version": "0.3.6",
       "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.6.tgz",
       "integrity": "sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.5",
@@ -9856,7 +9856,7 @@
       "version": "1.13.3",
       "resolved": "https://registry.npmjs.org/@swc-node/core/-/core-1.13.3.tgz",
       "integrity": "sha512-OGsvXIid2Go21kiNqeTIn79jcaX4l0G93X2rAnas4LFoDyA9wAwVK7xZdm+QsKoMn5Mus2yFLCc4OtX2dD/PWA==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "engines": {
         "node": ">= 10"
@@ -9874,7 +9874,7 @@
       "version": "1.9.2",
       "resolved": "https://registry.npmjs.org/@swc-node/register/-/register-1.9.2.tgz",
       "integrity": "sha512-BBjg0QNuEEmJSoU/++JOXhrjWdu3PTyYeJWsvchsI0Aqtj8ICkz/DqlwtXbmZVZ5vuDPpTfFlwDBZe81zgShMA==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "@swc-node/core": "^1.13.1",
@@ -9897,7 +9897,7 @@
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/@swc-node/sourcemap-support/-/sourcemap-support-0.5.1.tgz",
       "integrity": "sha512-JxIvIo/Hrpv0JCHSyRpetAdQ6lB27oFYhv0PKCNf1g2gUXOjpeR1exrXccRxLMuAV5WAmGFBwRnNOJqN38+qtg==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "source-map-support": "^0.5.21",
@@ -9908,7 +9908,7 @@
       "version": "0.5.21",
       "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
       "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "buffer-from": "^1.0.0",
@@ -9919,7 +9919,7 @@
       "version": "1.5.29",
       "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.5.29.tgz",
       "integrity": "sha512-nvTtHJI43DUSOAf3h9XsqYg8YXKc0/N4il9y4j0xAkO0ekgDNo+3+jbw6MInawjKJF9uulyr+f5bAutTsOKVlw==",
-      "dev": true,
+      "devOptional": true,
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -9961,7 +9961,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -9978,7 +9977,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -9995,7 +9993,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "Apache-2.0",
       "optional": true,
       "os": [
@@ -10012,7 +10009,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -10029,7 +10025,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -10046,7 +10041,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -10063,7 +10057,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -10080,7 +10073,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -10097,7 +10089,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -10114,7 +10105,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "Apache-2.0 AND MIT",
       "optional": true,
       "os": [
@@ -10128,7 +10118,7 @@
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/@swc/counter/-/counter-0.1.3.tgz",
       "integrity": "sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0"
     },
     "node_modules/@swc/helpers": {
@@ -10144,7 +10134,7 @@
       "version": "0.1.21",
       "resolved": "https://registry.npmjs.org/@swc/types/-/types-0.1.21.tgz",
       "integrity": "sha512-2YEtj5HJVbKivud9N4bpPBAyZhj4S2Ipe5LkUG94alTpr7in/GU/EARgPAd3BwU+YOmFVJC2+kjqhGRi3r0ZpQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0",
       "dependencies": {
         "@swc/counter": "^0.1.3"
@@ -10664,7 +10654,7 @@
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.2.tgz",
       "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/@types/prop-types": {
@@ -10696,7 +10686,7 @@
       "version": "19.0.0",
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.0.0.tgz",
       "integrity": "sha512-1KfiQKsH1o00p9m5ag12axHQSb3FOU9H20UTrujVSkNhuCrRHiQWFqgEnTNK5ZNfnzZv8UWrnXVqCmCF9fgY3w==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "@types/react": "*"
@@ -13342,7 +13332,7 @@
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz",
       "integrity": "sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.12.5",
@@ -13358,7 +13348,7 @@
       "version": "7.1.0",
       "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz",
       "integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "@types/parse-json": "^4.0.0",
@@ -13375,7 +13365,7 @@
       "version": "1.10.2",
       "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
       "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
-      "dev": true,
+      "devOptional": true,
       "license": "ISC",
       "engines": {
         "node": ">= 6"
@@ -13840,7 +13830,7 @@
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
       "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "engines": {
         "node": ">=6"
@@ -14248,7 +14238,7 @@
       "version": "2.0.20",
       "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.20.tgz",
       "integrity": "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/columnify": {
@@ -15447,7 +15437,7 @@
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
       "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "is-arrayish": "^0.2.1"
@@ -18516,7 +18506,7 @@
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
       "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "parent-module": "^1.0.0",
@@ -18672,7 +18662,7 @@
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
       "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/is-async-function": {
@@ -19501,7 +19491,7 @@
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.4.2.tgz",
       "integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "bin": {
         "jiti": "lib/jiti-cli.mjs"
@@ -19645,7 +19635,7 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
       "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/json-schema-traverse": {
@@ -22724,7 +22714,7 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
       "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "callsites": "^3.0.0"
@@ -22756,7 +22746,7 @@
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
       "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.0.0",
@@ -22775,7 +22765,7 @@
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
       "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/parse-ms": {
@@ -22858,7 +22848,7 @@
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
       "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/path-scurry": {
@@ -22893,7 +22883,7 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
       "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -22982,7 +22972,7 @@
       "version": "4.0.7",
       "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.7.tgz",
       "integrity": "sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "engines": {
         "node": ">= 6"
@@ -24385,7 +24375,7 @@
       "version": "1.22.8",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
       "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "is-core-module": "^2.13.0",
@@ -24417,7 +24407,7 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
       "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "engines": {
         "node": ">=4"
@@ -25775,7 +25765,7 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
       "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.4"
@@ -26057,7 +26047,7 @@
       "version": "5.39.0",
       "resolved": "https://registry.npmjs.org/terser/-/terser-5.39.0.tgz",
       "integrity": "sha512-LBAhFyLho16harJoWMg/nZsQYgTrg5jXOn2nCYjRUcZZEdE3qa2zb8QEDRUGVZBW4rlazf2fxkg8tztybTaqWw==",
-      "dev": true,
+      "devOptional": true,
       "license": "BSD-2-Clause",
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
@@ -26131,14 +26121,14 @@
       "version": "2.20.3",
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/terser/node_modules/source-map-support": {
       "version": "0.5.21",
       "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
       "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "buffer-from": "^1.0.0",
@@ -26691,7 +26681,7 @@
       "version": "5.8.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
       "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",

script/website/unix_frontend_dev.sh

@@ -0,0 +1,26 @@
+#!/usr/bin/env bash
+# This works on Linux and MacOS to launch the frontend dev server
+
+root_dir=$(pwd)
+frontend_path="${root_dir}/frontend"
+
+echo "Running Artcraft Website in Dev Mode..."
+echo ""
+
+# Kill any process running on port 5741, which will block startup
+if lsof -i tcp:4200 &>/dev/null; then
+  lsof -i tcp:4200 -t | xargs kill -9
+  echo "Killed process running on port 4200"
+else
+  echo "No process running on port 4200"
+fi
+
+pushd "${frontend_path}" || exit
+
+npm install --verbose
+
+export VITE_ENVIRONMENT_TYPE="production"
+
+nx dev artcraft-website
+
+popd || exit