diff --git a/.vscode/settings.json b/.vscode/settings.json deleted file mode 100644 index 797374d..0000000 --- a/.vscode/settings.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "marquee.widgets.npm-stats.packageNames": [ - "portfolio" - ] -} \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index 6c9b11f..d351cb3 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -7,8 +7,6 @@ import Model from '@/components/Model'; import Controls from '@/components/Controls'; import Image from 'next/image' -var enableCrt:boolean = true; - export default function Home() { const [currentCrt, setCrt] = useState(false) diff --git a/src/components/Controls.tsx b/src/components/Controls.tsx index 736b82f..c870d26 100644 --- a/src/components/Controls.tsx +++ b/src/components/Controls.tsx @@ -22,7 +22,7 @@ const Controls: React.FC = ({ changeState }) => { checked={crt} onChange={handleChange} /> - + ); }; diff --git a/src/components/Model.tsx b/src/components/Model.tsx index c9eae09..1d97526 100644 --- a/src/components/Model.tsx +++ b/src/components/Model.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useRef } from 'react'; import * as THREE from 'three'; -const AsciiCube = () => { +const Sphere = () => { const canvasRef = useRef(null!); useEffect(() => { @@ -11,18 +11,20 @@ const AsciiCube = () => { const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(30, 1, 0.1, 1000); camera.position.z = 5; + camera.rotateZ(-0.2); - const geometry = new THREE.BoxGeometry(1, 1, 1); + const geometry = new THREE.SphereGeometry(1, 22, 22, 0, Math.PI * 2, 0, Math.PI * 2); const edges = new THREE.EdgesGeometry(geometry); const material = new THREE.LineBasicMaterial({ color: 0xffffff }); - const wireframe = new THREE.LineSegments(edges, material); - scene.add(wireframe); + const sphere = new THREE.LineSegments(edges, material); + scene.add(sphere); + /* sphere.rotation.z = 10 */ const animate = () => { requestAnimationFrame(animate); - wireframe.rotation.x += 0.01; - wireframe.rotation.y += 0.01; + /* sphere.rotation.x += 0.01; */ + sphere.rotation.y += 0.01; renderer.render(scene, camera); }; @@ -49,4 +51,4 @@ const AsciiCube = () => { return ; }; -export default AsciiCube; \ No newline at end of file +export default Sphere; \ No newline at end of file diff --git a/src/components/Terminal.tsx b/src/components/Terminal.tsx index f6f0507..4c56cec 100644 --- a/src/components/Terminal.tsx +++ b/src/components/Terminal.tsx @@ -136,6 +136,7 @@ const Terminal = () => { } const preRef = useRef(null); + const inputRef = useRef(document.createElement("input")) const [input, setInput] = useState(""); const [output, setOutput] = useState(start.join('\n')); @@ -143,16 +144,19 @@ const Terminal = () => { if (preRef.current) { preRef.current.scrollTop = preRef.current.scrollHeight; } + + inputRef.current.focus() }, [output]); return ( -
+
inputRef.current.focus()}>
{output}
@guest from portfolio

>

{ }, 80); }, [currentText]); - return

>{currentText}|

+ return

>{currentText}

}; -export default Typewriter; \ No newline at end of file +export default Typewriter; diff --git a/src/css/page.module.css b/src/css/page.module.css index 1db880e..ef20ccd 100644 --- a/src/css/page.module.css +++ b/src/css/page.module.css @@ -59,8 +59,8 @@ border: 3px solid rgb(255, 255, 255); height: 40%; animation: right 1.5s ease; - background: repeating-linear-gradient(90deg, #ffffff 0, #ffffff 5%, transparent 0, transparent 50%), repeating-linear-gradient(180deg, #ffffff 0, #ffffff 5%, transparent 0, transparent 50%); - background-size: 3em 3em; + background: repeating-linear-gradient(90deg, #ffffff 0, #ffffff 3%, transparent 0, transparent 50%), repeating-linear-gradient(180deg, #ffffff 0, #ffffff 3%, transparent 0, transparent 50%); + background-size: 2.5em 2.5em; background-color: #00000000; opacity: 1; } @@ -88,7 +88,7 @@ .scanner { animation: scanning 2s infinite linear; - background-color: rgba(133, 133, 133, 0.266); + background-color: rgba(133, 133, 133, 0.266); position: fixed; top: 0; left: 0; @@ -145,4 +145,10 @@ font-size: 5vh; text-align: center; } + + .bright h1 + { + font-size: 5vh; + text-align: center; + } } \ No newline at end of file diff --git a/src/css/terminal.module.css b/src/css/terminal.module.css index 399f80e..7ec6156 100644 --- a/src/css/terminal.module.css +++ b/src/css/terminal.module.css @@ -15,6 +15,7 @@ transform: translateY(500px); opacity: 0%; filter: blur(2px); + height: 0; /* This is to compensate the effect that makes the terminal be focus from the start */ } 75%{ transform: translateY(-10px); @@ -22,6 +23,7 @@ 100%{ transform: translateY(0); opacity: 100%; + height: 100; } } @@ -64,7 +66,7 @@ } .prompt input { - font-size: 125%; + font-size: 100%; } } @@ -81,4 +83,4 @@ white-space: pre-wrap; word-wrap: break-word; } -} \ No newline at end of file +}