Add logo etc.

src/app/page.tsx

@@ -1,4 +1,4 @@
-import SphereCurve from "@/components/3d/curves/sphere";
+import ThingCurve from "@/components/3d/curves/thing";
 import RenderedSection from "@/components/3d/renderedsection";
 
 export default function Home() {
@@ -6,7 +6,7 @@ export default function Home() {
     <>
       <RenderedSection
         id="about"
-        curve={SphereCurve}
+        curve={ThingCurve}
         className="relative w-full h-full px-4 md:px-8 max-w-screen-2xl"
         curveClassname="w-[38rem] h-[52rem] -right-32 md:right-8 overflow-hidden"
       >

src/components/3d/curves/lorentz.ts

@@ -1,82 +0,0 @@
-"use client";
-
-import * as THREE from "three";
-import { CurveProps } from "../renderer";
-
-const maxParticles = 20000;
-
-const startScatter = 0.1;
-
-const init = () => {
-  var arrayCurve = [];
-
-  var x = 0.01,
-    y = 0.01,
-    z = 0.01;
-  var a = 0.9;
-  var b = 3.4;
-  var f = 9.9;
-  var g = 1;
-  var t = 0.001;
-  for (var i = 0; i < maxParticles; i++) {
-    x = x - t * a * x + t * y * y - t * z * z + t * a * f;
-    y = y - t * y + t * x * y - t * b * x * z + t * g;
-    z = z - t * z + t * b * x * y + t * x * z;
-    arrayCurve.push(
-      new THREE.Vector3(x, y, z).multiplyScalar(
-        1 - startScatter / 2 + Math.random() * startScatter
-      )
-    );
-  }
-  return arrayCurve;
-};
-
-const update = (pc: THREE.Points<THREE.BufferGeometry>, group: THREE.Group) => {
-  //Varying the points on each frame
-  // step += 0.01;
-  var geometry = pc.geometry;
-  var a = 0.9  //+ Math.random() * .2;
-  var b = 3.4  //+ Math.random() * .1;
-  var f = 9.9  //+ Math.random() * .2;
-  var g = 1    //+ Math.random() * .1;
-  var t = 0.001;
-
-  var positions = geometry.attributes.position;
-  const numPoints = positions.array.length / 3;
-
-  for (let i = 0; i < numPoints; i++) {
-    let x = positions.getX(i),
-      y = positions.getY(i),
-      z = positions.getZ(i);
-    positions.setXYZ(
-      i,
-      x - t * a * x + t * y * y - t * z * z + t * a * f,
-      y - t * y + t * x * y - t * b * x * z + t * g,
-      z - t * z + t * b * x * y + t * x * z
-    );
-  }
-  positions.needsUpdate = true;
-
-  // TODO: remove
-  // group.rotation.x += 0.0005;
-  // group.rotation.y += 0.001;
-  // group.rotation.z -= 0.0005;
-};
-
-// INFO: Curve definition
-const LorentzCurve: CurveProps = {
-  func: { init: init, update: update },
-  cam: {
-    pos: new THREE.Vector3(8, 8, 18).multiplyScalar(2),
-    rotation: new THREE.Vector3(0, 0, 180),
-  },
-  particles: {
-    max: maxParticles,
-    size: 0.1,
-    color: "#888",
-    darkcolor: "#444",
-    opacity: 0.4,
-  }, // 87a
-};
-
-export default LorentzCurve;

src/components/3d/curves/thing.ts

@@ -64,7 +64,7 @@ const update = (pc: THREE.Points<THREE.BufferGeometry>, group: THREE.Group) => {
 };
 
 // INFO: Curve definition
-const SphereCurve = {
+const ThingCurve = {
   func: { init: init, update: update },
   cam: {
     pos: new THREE.Vector3(0, 0, 18).multiplyScalar(1.7),
@@ -79,4 +79,4 @@ const SphereCurve = {
   }, // 87a
 };
 
-export default SphereCurve;
+export default ThingCurve;

src/components/layout/header.tsx

@@ -1,5 +1,4 @@
 import { Separator } from "@/components/ui/separator";
-import { cn } from "@/lib/utils";
 import { Button } from "../ui/button";
 
 import Link from "next/link";
@@ -7,6 +6,8 @@ import ThemeButton from "../themebutton";
 import NavLinks from "../navlinks";
 import NavCommand from "./nav";
 
+import Logo from "@/components/logo";
+
 const Header = () => (
   <header className="w-full h-14 flex flex-col justify-center items-center">
     <div className="py-2 px-4 md:px-8 flex flex-row justify-between w-full max-w-screen-2xl">
@@ -15,15 +16,7 @@ const Header = () => (
           href="/"
           className="flex flex-row items-center gap-x-2 hover:opacity-80 transition-opacity"
         >
-          {/* <Logo className="h-6 w-6" /> */}
+          <Logo className="w-8 h-auto" />
-          <span
-            className={cn(
-              "text-2xl",
-              // fonts.mono.className,
-            )}
-          >
-            Wych
-          </span>
         </Link>
       </div>
       <div className="flex flex-row items-center space-x-2">

src/components/logo.tsx

@@ -1,30 +1,20 @@
 import * as React from "react";
 import { SVGProps } from "react";
 
-type LogoProps = { className?: string } & SVGProps<SVGSVGElement>;
+type LogoProps = {
+  className?: string;
+} & SVGProps<SVGSVGElement>;
 
 const Logo: React.FC<LogoProps> = (props: SVGProps<SVGSVGElement>) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
-    // width={92}
+    viewBox="0 0 179 103"
-    // height={129}
-    viewBox="0 0 92 129"
     fill="none"
     {...props}
   >
     <path
       fill="currentColor"
-      d="m40.915 4.102 8.244-.876-5.315 11.358-1.313 3.512a43.993 43.993 0 0 0-2.784 15.01l-.004.493a38.5 38.5 0 0 0 .555 6.872l.349 2.029c.16.935.406 1.854.732 2.746l.455 1.242a9.208 9.208 0 0 0 4.235 4.918l.339.185c.964.526 1.997.913 3.07 1.148l1.127.247a8.05 8.05 0 0 0 5.944-1.008l2.78-1.712a66.103 66.103 0 0 0 10.82-10.624l4.146-5.132 7.378-11.35a.825.825 0 0 0 .129-.536.825.825 0 0 1 .733-.908l.16-.017a.984.984 0 0 1 .261.007l2.387.387 1.519.245a7.548 7.548 0 0 0 2.003.055l1.188-.126a.185.185 0 0 0 .058-.016c.173-.079.34.12.232.277l-1.954 2.839-4.382 7.436-3.388 6.207L75.48 49.9l-3.62 8.255-1.228 3.283a12.15 12.15 0 0 0-.353 7.409l.647 2.41c.085.315.122.64.11.966l-.013.357a2.198 2.198 0 0 1-1.858 2.093l-5.397.84a16.353 16.353 0 0 1-5.649-.107l-.17-.033-3.922-.932-7.493-2.802-5.914-2.745-5.913-2.744-6.557-2.452-1.036 2.771a22.716 22.716 0 0 0-1.21 11.159l.508 3.57 1.3 12.23 2.826 18.138.463 1.574a6.011 6.011 0 0 0 3.054 3.671l1.356.686c.81.41 1.666.723 2.55.933l1.042.248c1.031.245 2.08.411 3.137.495l2.041.163 1.58.057-3.685 1.291-2.752.808a13.13 13.13 0 0 1-6.218.29l-.44-.087a18.752 18.752 0 0 1-2.995-.845l-1.495-.559a11.916 11.916 0 0 1-1.53-.699l-.681-.372a8.453 8.453 0 0 1-4.177-5.487l-.849-3.621-2.065-17.32L17.4 81.031l-.105-7.968a16.35 16.35 0 0 1 .301-3.345l.164-.838c.063-.326.154-.647.27-.958l.628-1.68c.159-.424.48-.768.891-.955l1.287-.587a10.336 10.336 0 0 1 4.051-.928l.572-.013 2.691-.06.588-.377a10.525 10.525 0 0 1 3.273-1.383l1.257-.134a8.856 8.856 0 0 1 4.036.511l6.472 2.42 6.089 2.277 7.2 2.158 4.858 1.282a8.716 8.716 0 0 1-.736-2.693l-.027-.261a10.335 10.335 0 0 1 .182-3.306l.167-.763c.154-.7.357-1.39.608-2.06l1.55-4.144 2.043-4.04-5.029 3.458-.544.3a14.398 14.398 0 0 1-12 .881l-2.964-1.107-3.278-1.226-2.518-1.317a14.213 14.213 0 0 1-6.665-7.467l-.095-.246a15.136 15.136 0 0 1-.866-3.322l-.28-1.968a32.551 32.551 0 0 1-.323-5.073l.072-4.883a67.58 67.58 0 0 1 3.554-13.787l1.345-3.598 3.165-8.464a1.964 1.964 0 0 1 1.631-1.265Z"
+      d="M24.5.5H.5l35 102h24L24.5.5ZM71.5 9.5h-25l24 84h24l12-44 11 44h25l23-84h-24l-13 50-13-50h-19l-13 50-12-50Z"
-    />
-    <path
-      stroke="currentColor"
-      strokeLinecap="round"
-      d="m28.15 63.698 6.557 2.452 5.913 2.744 5.914 2.745 7.493 2.802 3.922.932.17.033c1.862.364 3.774.4 5.649.108l5.397-.841a2.198 2.198 0 0 0 1.371-.79v0c.3-.37.47-.828.487-1.303l.013-.357a3.271 3.271 0 0 0-.11-.966l-.647-2.41a12.154 12.154 0 0 1-.403-2.581v0a12.15 12.15 0 0 1 .756-4.828l1.228-3.284 3.62-8.255 5.14-10.89 3.387-6.206 4.382-7.436 1.954-2.84c.108-.156-.06-.355-.232-.276v0a.185.185 0 0 1-.058.016l-1.188.126a7.548 7.548 0 0 1-2.003-.055l-1.52-.245-2.386-.387a.984.984 0 0 0-.261-.007l-.16.017a.825.825 0 0 0-.733.908v0a.825.825 0 0 1-.13.537L74.296 34.51l-4.147 5.132a66.103 66.103 0 0 1-10.82 10.624v0l-2.779 1.712a8.048 8.048 0 0 1-4.51 1.19v0a8.05 8.05 0 0 1-1.434-.182l-1.127-.247a11.587 11.587 0 0 1-3.07-1.148l-.339-.185a9.21 9.21 0 0 1-2.33-1.81v0a9.208 9.208 0 0 1-1.905-3.108l-.455-1.242a15.76 15.76 0 0 1-.732-2.746l-.35-2.03a38.5 38.5 0 0 1-.554-6.87l.004-.494a43.993 43.993 0 0 1 2.784-15.01l1.313-3.512L49.16 3.226l-8.244.876a1.963 1.963 0 0 0-1.13.515v0a1.964 1.964 0 0 0-.501.75l-3.165 8.464-1.345 3.598a67.58 67.58 0 0 0-3.554 13.787v0l-.072 4.883a32.551 32.551 0 0 0 .322 5.074l.28 1.967c.163 1.137.453 2.251.867 3.322l.095.246a14.21 14.21 0 0 0 4.663 6.195v0c.631.479 1.3.904 2.002 1.272l2.518 1.317 3.278 1.226 2.963 1.107a14.4 14.4 0 0 0 4.524.903v0a14.398 14.398 0 0 0 7.477-1.784l.544-.3 5.03-3.458M28.15 63.698l-1.037 2.771a22.716 22.716 0 0 0-1.343 5.878v0a22.716 22.716 0 0 0 .132 5.28l.509 3.57 1.3 12.23 2.826 18.139.463 1.574c.16.547.398 1.068.705 1.548v0a6.012 6.012 0 0 0 2.349 2.123l1.356.686c.81.41 1.666.723 2.55.933l1.042.248c1.031.245 2.08.411 3.137.495l2.041.163 1.58.057-3.685 1.291-2.752.808a13.13 13.13 0 0 1-4.176.524v0a13.212 13.212 0 0 1-2.042-.234l-.44-.087a18.752 18.752 0 0 1-2.995-.845l-1.495-.559a11.916 11.916 0 0 1-1.53-.699l-.681-.372a8.453 8.453 0 0 1-2.803-2.472v0a8.448 8.448 0 0 1-1.374-3.015l-.849-3.621-2.065-17.32L17.4 81.031l-.105-7.968a16.35 16.35 0 0 1 .301-3.345l.164-.838c.063-.326.154-.647.27-.958l.628-1.68c.159-.424.48-.768.891-.955v0l1.287-.587v0a10.336 10.336 0 0 1 4.051-.928l.572-.013 2.691-.06Zm0 0 .587-.376a10.525 10.525 0 0 1 3.273-1.383v0l1.257-.134a8.856 8.856 0 0 1 1.932.007v0c.72.081 1.426.25 2.104.504l6.472 2.42 6.089 2.277 7.2 2.158 4.858 1.282v0a8.716 8.716 0 0 1-.736-2.693l-.027-.261a10.335 10.335 0 0 1 .182-3.306l.167-.763c.154-.7.357-1.39.608-2.06l1.55-4.144 2.043-4.04m0 0 1.52-2.635"
-    />
-    <path
-      fill="currentColor"
-      stroke="currentColor"
-      d="m57 101 7.368-7.273L71 93l-3.684 5.09L57 101Z"
     />
   </svg>
 );

src/components/my.tsx

@@ -0,0 +1,31 @@
+import * as React from "react";
+import { SVGProps } from "react";
+
+type MySVGProps = { className?: string } & SVGProps<SVGSVGElement>;
+
+const MySVG: React.FC<MySVGProps> = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    // width={92}
+    // height={129}
+    viewBox="0 0 92 129"
+    fill="none"
+    {...props}
+  >
+    <path
+      fill="currentColor"
+      d="m40.915 4.102 8.244-.876-5.315 11.358-1.313 3.512a43.993 43.993 0 0 0-2.784 15.01l-.004.493a38.5 38.5 0 0 0 .555 6.872l.349 2.029c.16.935.406 1.854.732 2.746l.455 1.242a9.208 9.208 0 0 0 4.235 4.918l.339.185c.964.526 1.997.913 3.07 1.148l1.127.247a8.05 8.05 0 0 0 5.944-1.008l2.78-1.712a66.103 66.103 0 0 0 10.82-10.624l4.146-5.132 7.378-11.35a.825.825 0 0 0 .129-.536.825.825 0 0 1 .733-.908l.16-.017a.984.984 0 0 1 .261.007l2.387.387 1.519.245a7.548 7.548 0 0 0 2.003.055l1.188-.126a.185.185 0 0 0 .058-.016c.173-.079.34.12.232.277l-1.954 2.839-4.382 7.436-3.388 6.207L75.48 49.9l-3.62 8.255-1.228 3.283a12.15 12.15 0 0 0-.353 7.409l.647 2.41c.085.315.122.64.11.966l-.013.357a2.198 2.198 0 0 1-1.858 2.093l-5.397.84a16.353 16.353 0 0 1-5.649-.107l-.17-.033-3.922-.932-7.493-2.802-5.914-2.745-5.913-2.744-6.557-2.452-1.036 2.771a22.716 22.716 0 0 0-1.21 11.159l.508 3.57 1.3 12.23 2.826 18.138.463 1.574a6.011 6.011 0 0 0 3.054 3.671l1.356.686c.81.41 1.666.723 2.55.933l1.042.248c1.031.245 2.08.411 3.137.495l2.041.163 1.58.057-3.685 1.291-2.752.808a13.13 13.13 0 0 1-6.218.29l-.44-.087a18.752 18.752 0 0 1-2.995-.845l-1.495-.559a11.916 11.916 0 0 1-1.53-.699l-.681-.372a8.453 8.453 0 0 1-4.177-5.487l-.849-3.621-2.065-17.32L17.4 81.031l-.105-7.968a16.35 16.35 0 0 1 .301-3.345l.164-.838c.063-.326.154-.647.27-.958l.628-1.68c.159-.424.48-.768.891-.955l1.287-.587a10.336 10.336 0 0 1 4.051-.928l.572-.013 2.691-.06.588-.377a10.525 10.525 0 0 1 3.273-1.383l1.257-.134a8.856 8.856 0 0 1 4.036.511l6.472 2.42 6.089 2.277 7.2 2.158 4.858 1.282a8.716 8.716 0 0 1-.736-2.693l-.027-.261a10.335 10.335 0 0 1 .182-3.306l.167-.763c.154-.7.357-1.39.608-2.06l1.55-4.144 2.043-4.04-5.029 3.458-.544.3a14.398 14.398 0 0 1-12 .881l-2.964-1.107-3.278-1.226-2.518-1.317a14.213 14.213 0 0 1-6.665-7.467l-.095-.246a15.136 15.136 0 0 1-.866-3.322l-.28-1.968a32.551 32.551 0 0 1-.323-5.073l.072-4.883a67.58 67.58 0 0 1 3.554-13.787l1.345-3.598 3.165-8.464a1.964 1.964 0 0 1 1.631-1.265Z"
+    />
+    <path
+      stroke="currentColor"
+      strokeLinecap="round"
+      d="m28.15 63.698 6.557 2.452 5.913 2.744 5.914 2.745 7.493 2.802 3.922.932.17.033c1.862.364 3.774.4 5.649.108l5.397-.841a2.198 2.198 0 0 0 1.371-.79v0c.3-.37.47-.828.487-1.303l.013-.357a3.271 3.271 0 0 0-.11-.966l-.647-2.41a12.154 12.154 0 0 1-.403-2.581v0a12.15 12.15 0 0 1 .756-4.828l1.228-3.284 3.62-8.255 5.14-10.89 3.387-6.206 4.382-7.436 1.954-2.84c.108-.156-.06-.355-.232-.276v0a.185.185 0 0 1-.058.016l-1.188.126a7.548 7.548 0 0 1-2.003-.055l-1.52-.245-2.386-.387a.984.984 0 0 0-.261-.007l-.16.017a.825.825 0 0 0-.733.908v0a.825.825 0 0 1-.13.537L74.296 34.51l-4.147 5.132a66.103 66.103 0 0 1-10.82 10.624v0l-2.779 1.712a8.048 8.048 0 0 1-4.51 1.19v0a8.05 8.05 0 0 1-1.434-.182l-1.127-.247a11.587 11.587 0 0 1-3.07-1.148l-.339-.185a9.21 9.21 0 0 1-2.33-1.81v0a9.208 9.208 0 0 1-1.905-3.108l-.455-1.242a15.76 15.76 0 0 1-.732-2.746l-.35-2.03a38.5 38.5 0 0 1-.554-6.87l.004-.494a43.993 43.993 0 0 1 2.784-15.01l1.313-3.512L49.16 3.226l-8.244.876a1.963 1.963 0 0 0-1.13.515v0a1.964 1.964 0 0 0-.501.75l-3.165 8.464-1.345 3.598a67.58 67.58 0 0 0-3.554 13.787v0l-.072 4.883a32.551 32.551 0 0 0 .322 5.074l.28 1.967c.163 1.137.453 2.251.867 3.322l.095.246a14.21 14.21 0 0 0 4.663 6.195v0c.631.479 1.3.904 2.002 1.272l2.518 1.317 3.278 1.226 2.963 1.107a14.4 14.4 0 0 0 4.524.903v0a14.398 14.398 0 0 0 7.477-1.784l.544-.3 5.03-3.458M28.15 63.698l-1.037 2.771a22.716 22.716 0 0 0-1.343 5.878v0a22.716 22.716 0 0 0 .132 5.28l.509 3.57 1.3 12.23 2.826 18.139.463 1.574c.16.547.398 1.068.705 1.548v0a6.012 6.012 0 0 0 2.349 2.123l1.356.686c.81.41 1.666.723 2.55.933l1.042.248c1.031.245 2.08.411 3.137.495l2.041.163 1.58.057-3.685 1.291-2.752.808a13.13 13.13 0 0 1-4.176.524v0a13.212 13.212 0 0 1-2.042-.234l-.44-.087a18.752 18.752 0 0 1-2.995-.845l-1.495-.559a11.916 11.916 0 0 1-1.53-.699l-.681-.372a8.453 8.453 0 0 1-2.803-2.472v0a8.448 8.448 0 0 1-1.374-3.015l-.849-3.621-2.065-17.32L17.4 81.031l-.105-7.968a16.35 16.35 0 0 1 .301-3.345l.164-.838c.063-.326.154-.647.27-.958l.628-1.68c.159-.424.48-.768.891-.955v0l1.287-.587v0a10.336 10.336 0 0 1 4.051-.928l.572-.013 2.691-.06Zm0 0 .587-.376a10.525 10.525 0 0 1 3.273-1.383v0l1.257-.134a8.856 8.856 0 0 1 1.932.007v0c.72.081 1.426.25 2.104.504l6.472 2.42 6.089 2.277 7.2 2.158 4.858 1.282v0a8.716 8.716 0 0 1-.736-2.693l-.027-.261a10.335 10.335 0 0 1 .182-3.306l.167-.763c.154-.7.357-1.39.608-2.06l1.55-4.144 2.043-4.04m0 0 1.52-2.635"
+    />
+    <path
+      fill="currentColor"
+      stroke="currentColor"
+      d="m57 101 7.368-7.273L71 93l-3.684 5.09L57 101Z"
+    />
+  </svg>
+);
+export default MySVG;