diff --git a/site/.svelte-kit/generated/server/internal.js b/site/.svelte-kit/generated/server/internal.js index ea4f7f8..e69fc97 100644 --- a/site/.svelte-kit/generated/server/internal.js +++ b/site/.svelte-kit/generated/server/internal.js @@ -18,10 +18,10 @@ export const options = { root, service_worker: false, templates: { - app: ({ head, body, assets, nonce, env }) => "\n\n \n \n \n \n " + head + "\n \n \n
" + body + "
\n \n\n\n\n", + app: ({ head, body, assets, nonce, env }) => "\n\n \n \n \n \n \n \n
" + body + "
\n \n\n\n", error: ({ status, message }) => "\n\n\t\n\t\t\n\t\t" + message + "\n\n\t\t\n\t\n\t\n\t\t
\n\t\t\t" + status + "\n\t\t\t
\n\t\t\t\t

" + message + "

\n\t\t\t
\n\t\t
\n\t\n\n" }, - version_hash: "i6vb0w" + version_hash: "1mj17wc" }; export async function get_hooks() { diff --git a/site/src/app.html b/site/src/app.html index 1325fd9..43d4ace 100644 --- a/site/src/app.html +++ b/site/src/app.html @@ -4,15 +4,11 @@ + - -
%sveltekit.body%
+ +
%sveltekit.body%
- diff --git a/site/src/routes/+page.svelte b/site/src/routes/+page.svelte index b95cce3..562a20b 100644 --- a/site/src/routes/+page.svelte +++ b/site/src/routes/+page.svelte @@ -1,78 +1,84 @@ + + + -
-

Hey, I'm

-
-

JEREMY JANELLA

-
-

Computer nerd, gamer, mountain biker, adventurer

+ + Jeremy Janella | Computer Scientist + + +
+

Hey! My name is

+ +

An experienced full stack developer, cybersecurity enthusiest, 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

+

This site is still being ported!

+
- + // Start typing effect + setTimeout(typeEffect, 250); + + return { + onDestroy() {}, + update(newTexts: string[]) { + textsToType = newTexts; + } + }; +} + \ No newline at end of file diff --git a/site/src/style.css b/site/src/style.css new file mode 100644 index 0000000..491b7bd --- /dev/null +++ b/site/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: 55vmax; + max-width: 70vmax; + 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; } +} +