Merge pull request #7 from Fyrlex/dev

updates
Fyrlex · Nov 14, 2023 · 6891dcd · 6891dcd
2 parents ca42c39 + d417164
commit 6891dcd
Show file tree

Hide file tree

Showing 5 changed files with 53 additions and 32 deletions.
diff --git a/src/components/hobbies.svelte b/src/components/hobbies.svelte
@@ -9,7 +9,7 @@
 
 {#each data as { date, description, src, title }, i}
 	<div
-		class="lg:flex lg:w-[50vw] mx-auto bg-stone-800 rounded-md border border-stone-600 shadow-lg scale-[0.9] hover:scale-[1] duration-700"
+		class="lg:flex lg:w-[70vw] mx-auto bg-stone-800 rounded-md border border-stone-600 shadow-lg scale-[0.95] hover:scale-[1] duration-700"
 	>
 		{#if i % 2 === 0}
 			<img
@@ -18,9 +18,13 @@
 				class="rounded-t-md border-b lg:border-b-0 lg:rounded-none lg:rounded-l-md lg:border-r border-stone-600 lg:w-2/3"
 			/>
 			<div class="relative flex flex-col mx-auto">
-				<p class="text-4xl p-2 text-cyan-500">{title}</p>
-				<p class="text-2xl w-3/4 mx-auto mb-10">{description}</p>
-				<p class="lg:text-2xl absolute inset-x-0 bottom-0 p-2">{date}</p>
+				<p class="text-2xl md:text-3xl xl:text-4xl m-2 text-cyan-500">
+					{title}
+				</p>
+				<p class="text-xl lg:text-xl xl:text-3xl w-3/4 mx-auto mb-10">
+					{description}
+				</p>
+				<p class="text-lg lg:text-xl absolute inset-x-0 bottom-0 p-2">{date}</p>
 			</div>
 		{:else}
 			<img
@@ -29,9 +33,15 @@
 				class="lg:hidden rounded-t-md border-b lg:border-b-0 lg:rounded-none lg:rounded-r-md lg:border-l border-stone-600 lg:w-2/3"
 			/>
 			<div class="relative flex flex-col mx-auto">
-				<p class="text-4xl p-2 text-cyan-500">{title}</p>
-				<p class="text-2xl w-3/4 mx-auto mb-10">{description}</p>
-				<p class="lg:text-2xl absolute inset-x-0 bottom-0 p-2">{date}</p>
+				<p class="text-2xl md:text-3xl xl:text-4xl p-2 text-cyan-500">
+					{title}
+				</p>
+				<p class="text-xl lg:text-xl xl:text-3xl w-3/4 mx-auto mb-10">
+					{description}
+				</p>
+				<p class="text-lg lg:text-xl absolute inset-x-0 bottom-0 p-2">
+					{date}
+				</p>
 			</div>
 			<img
 				{src}

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -14,11 +14,11 @@
 </script>
 
 <nav
-	class="flex space-x-6 bg-stone-900 font-extralight text-center text-2xl justify-center items-center h-20"
+	class="flex bg-stone-900 font-extralight text-center text-xl sm:text-2xl md:text-3xl lg:text-4xl justify-center items-center h-20"
 >
 	{#each pages as { name, url }, i}
 		<a
-			class="text-cyan-500 hover:text-cyan-400 duration-300"
+			class="text-cyan-500 mx-auto hover:text-cyan-400 duration-300"
 			href="{base}/{url}">{name}</a
 		>{/each}
 </nav>

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
@@ -7,8 +7,12 @@
 </svelte:head>
 
 <div class="bg-stone-900 text-center text-gray-300">
-	<h1 class="text-8xl font-semibold p-10">Hey!</h1>
-	<p class="text-2xl w-1/3 max-w-fit mx-auto">
+	<h1
+		class="text-6xl sm:text-7xl md:text-8xl lg:text-8xl xl:text-8xl 2xl:text-8xl font-semibold p-10"
+	>
+		Hey!
+	</h1>
+	<p class="text-2xl w-[90vw] sm:w-1/2 max-w-fit mx-auto">
 		My name is Jaren Goldberg. Currently I am a freshman at Virginia Tech and
 		plan to major in Computer Science. I enjoy many activies including sports
 		and the gym, astronomy, playing music with my band, and being outside in

diff --git a/src/routes/astronomy/+page.svelte b/src/routes/astronomy/+page.svelte
@@ -22,10 +22,9 @@
 		},
 		{
 			title: "Triffid Nebula",
-			description:
-				"Celestron Omni 150 XLT, ZWO ASI 183MC, ~1.5 hours @ 30s sub-exposure.",
+			description: "A diffuse, reflection and emission nebula.",
 			src: ASTRO_TRIFFID,
-			date: "Sky Meadows State Park - July 10, 2023",
+			date: "Delaplane, VA - July 10, 2023",
 		},
 		{
 			title: "Waxing Gibbous",
@@ -47,16 +46,20 @@
 </svelte:head>
 
 <div class="h-screen bg-stone-900 text-center text-gray-300 font-extralight">
-	<h1 class="text-6xl lg:text-8xl text-center p-8">astronomy experience</h1>
-	<div class="m-5">
-		<h2 class="text-4xl lg:text-6xl text-cyan-500 m-4">Astrophotography</h2>
-		<p class="text-2xl w-1/2 my-5 max-w-fit mx-auto">
-			Member of the Northern Virginia Astronomy Club and Astronomy Club of
-			Virginia Tech.
-		</p>
-		<p class="text-cyan-500 text-2xl">Personal Equipment</p>
-		<p class="text-xl">Celestron Omni XLT 150</p>
-		<p class="text-xl">ZWO ASI 183MC</p>
+	<h1 class="text-5xl lg:text-8xl text-center lg:p-8">astronomy experience</h1>
+	<div class="m-10">
+		<div class="m-5">
+			<h2 class="text-3xl lg:text-6xl text-cyan-500 m-2 mx-auto">
+				Astrophotography
+			</h2>
+			<p class="text-xl lg:text-2xl w-[70vw] max-w-fit mb-4 mx-auto">
+				Member of the Northern Virginia Astronomy Club and Astronomy Club of
+				Virginia Tech.
+			</p>
+			<p class="text-cyan-500 text-2xl lg:text-3xl">Personal Equipment</p>
+			<p class="text-xl">Celestron Omni XLT 150</p>
+			<p class="text-xl">ZWO ASI 183MC</p>
+		</div>
 		<Hobbies data={astroImages} />
 	</div>
 </div>
diff --git a/src/routes/music/+page.svelte b/src/routes/music/+page.svelte
@@ -37,14 +37,18 @@
 </svelte:head>
 
 <div class="h-screen bg-stone-900 text-center text-gray-300 font-extralight">
-	<h1 class="text-6xl lg:text-8xl text-center p-8">music experience</h1>
-	<div class="m-5">
-		<h2 class="text-6xl text-cyan-500 m-4">Electric Bassist</h2>
-		<p class="text-2xl w-1/2 max-w-fit mx-auto">
-			Member of rock band <a href="https://clishae.us" class="text-cyan-500"
-				>Clishae</a
-			>
-		</p>
+	<h1 class="text-5xl lg:text-8xl text-center lg:p-8">music experience</h1>
+	<div class="m-10">
+		<div class="m-5">
+			<h2 class="text-3xl lg:text-6xl text-cyan-500 m-2 mx-auto">
+				Electric Bassist
+			</h2>
+			<p class="text-xl lg:text-2xl w-[70vw] max-w-fit mb-4 mx-auto">
+				Member of rock band <a href="https://clishae.us" class="text-cyan-500"
+					>Clishae</a
+				>
+			</p>
+		</div>
 		<Hobbies data={musicImages} />
 	</div>
 </div>