fix: restructered root dir

2025-03-12 03:20:35 -04:00
parent 4b323978ae
commit 58b08839cc
1644 changed files with 1520 additions and 889806 deletions
--- a/src/app.d.ts
+++ b/src/app.d.ts
@@ -0,0 +1,13 @@
+// See https://svelte.dev/docs/kit/types#app.d.ts
+// for information about these interfaces
+declare global {
+	namespace App {
+		// interface Error {}
+		// interface Locals {}
+		// interface PageData {}
+		// interface PageState {}
+		// interface Platform {}
+	}
+}
+
+export {};
--- a/src/app.html
+++ b/src/app.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <link rel="icon" href="%sveltekit.assets%/favicon.png" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <link rel="stylesheet" href="src/style.css"
+        %sveltekit.head%
+    </head>
+    <body id="background" data-sveltekit-preload-data="hover">
+        <div class="background">%sveltekit.body%</div>
+    </body>
+</html>
+
--- a/src/lib/index.ts
+++ b/src/lib/index.ts
@@ -0,0 +1 @@
+// place files you want to import through the `$lib` alias in this folder.
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -0,0 +1,84 @@
+<!-- <div id="navbar">
+    <button>Home</button>
+    <button>About</button>
+    <!-- turning ideas into reality with tech -->
+    <!-- into gritty hard-scifi games -->
+    <!-- <button>Projects</button>
+    <button>Hobbies</button>
+    <button>Contact</button>
+</div> -->
+
+<svelte:head>
+    <title>Jeremy Janella | Computer Scientist</title>
+</svelte:head>
+
+<div id="name-card" class="align-right card">
+    <p id="HeyIm">Hey! My name is</p>
+    <span use:animateTyping={["Jeremy Janella"]} id="jeremymaxxing"></span>
+    <p>An experienced full stack developer, cybersecurity enthusiast, and computer science student at the University of Toronto active in CTFs, hackathons, programming competitions, and indie developer of the soon-to-be-released game Subterworks</p>
+    <p>This site is still being ported!</p>
+    <!-- <p>Computer nerd, gamer, mountain biker, adventurer, hard sci-fi enjoyer, ethics enjoyer, swimmer, jumper</p> -->
+</div>
+
+<!-- <p>Computer Science Student, Interested in Cyber Security, Networiking, Open source, and always learning something new</p>-->
+
+<!-- Game dev, servers experiements, cyberpatriot, linux, ai serversresume-->
+
+<script lang="ts">
+    export function animateTyping(node: HTMLElement, texts: string[]) {
+	let textsToType = texts;
+
+	let textsIndex = 0;
+	let charIndex = 0;
+	let currentText = '';
+
+	const updateInnerHTML = () => {
+		// Always include the zero-width space and conditionally add the text and cursor
+		node.innerHTML = '&#8203;' + currentText;
+	};
+
+	const waitMsec = (delay: number) => {
+		setTimeout(() => { updateInnerHTML();}, delay);
+	};
+
+	// Typing animation effect
+	const typeEffect = () => {
+		const currentString = textsToType[textsIndex];
+		const delay = currentString[charIndex] === ' ' ? 25 : 30;
+
+		if (charIndex < currentString.length) {
+			currentText += currentString[charIndex++];
+			setTimeout(typeEffect, delay);
+		} else {
+			waitMsec(3000);
+			setTimeout(deleteEffect, 6000); // Wait before starting to delete
+		}
+
+		updateInnerHTML();
+	};
+
+	// Deleting animation effect
+	const deleteEffect = () => {
+		if (charIndex > 0) {
+			currentText = currentText.slice(0, --charIndex);
+			setTimeout(deleteEffect, 20);
+		} else {
+			textsIndex = (textsIndex + 1) % textsToType.length;
+			currentText = ''; // Clear text but keep zero-width space
+			setTimeout(typeEffect, 1250);
+		}
+
+		updateInnerHTML();
+	};
+
+	// Start typing effect
+	setTimeout(typeEffect, 250);
+
+	return {
+		onDestroy() {},
+		update(newTexts: string[]) {
+			textsToType = newTexts;
+		}
+	};
+}
+</script>
--- a/src/style.css
+++ b/src/style.css
@@ -0,0 +1,93 @@
+#name-card {
+    background-color: #222;
+}
+
+#projects-card {
+    background-color: maroon;
+}
+
+#hobbies-card {
+    background-color: #FFCE00;
+}
+
+button {
+    border-radius: 0px;
+    background-color: #222;
+    border-width: 0;
+    padding: 20px;;
+}
+
+.card {
+    margin-top: 2rem;
+    min-width: 55vw;
+    max-width: 70vw;
+    width: min-content;
+    margin-bottom: 2rem;
+    padding: 12px;
+}
+.align-right {
+    float: right;
+    border-left: 0.8rem solid orangered;
+}
+.align-left {
+    margin-right: 25%;
+}
+
+#HeyIm {
+    padding-left: 5ch;
+    font-weight: 600;
+    margin: 10px;
+    margin-bottom: 15px;
+}
+body {
+    background-color: #000;
+    margin: 0px;
+}
+
+* {
+    color: rgb(212 212 216);
+    font-family: sans-serif;
+}
+
+#jeremymaxxing {
+    font-weight: 1000;
+    font-size: 5rem;
+    line-height: 1;
+    margin: 20px;
+    text-shadow: 2px 2px orangered, -2px -2px cornflowerblue;
+    letter-spacing: 2px;
+    width: fit-content;
+    border-right: 0.4rem solid orangered;
+}
+
+.title {
+    font-weight: 600;
+    font-size: 4rem;
+ 
+}
+
+/* https://css-tricks.com/snippets/css/typewriter-effect/ */
+.typed {
+    font-family: monospace;
+    overflow: hidden; /* Ensures the content is not revealed until the animation */
+    border-right: .1em solid orangered; /* The typwriter cursor */
+    white-space: nowrap; /* Keeps the content on a single line */
+    /* margin: 0 auto; /* Gives that scrolling effect as the typing happens */
+    
+    animation: 
+    typing 0.5s steps(16);
+}
+
+
+/* The typing effect */
+@keyframes typing {
+    from { width: 0 }
+    to { width: 110% }
+}
+
+/* The typewriter cursor effect */
+@keyframes blink {
+    from, to { border-color: orangered}
+    50% { border-color: transparent; }
+}
+
				`@@ -0,0 +1 @@`
				// place files you want to import through the `$lib` alias in this folder.