update about text, music page

This commit is contained in:
Noah Swerhun 2024-04-13 14:46:36 -05:00
parent a67310bf89
commit aac74b7914
4 changed files with 60 additions and 38 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.6 MiB

After

Width:  |  Height:  |  Size: 277 KiB

View file

@ -1,6 +1,7 @@
import { For, onMount, type Component } from "solid-js"; import { For, onMount, type Component } from "solid-js";
import { useStore } from "@nanostores/solid"; import { useStore } from "@nanostores/solid";
import { $currentPage } from "@/scripts/currentPage" import { $currentPage } from "@/scripts/currentPage"
import PageLink from "./PageLink";
type Page = { type Page = {
path: string, path: string,
@ -10,11 +11,10 @@ type Page = {
const pages: Page[] = [ const pages: Page[] = [
{ path: "/", name: "about" }, { path: "/", name: "about" },
{ path: "/music", name: "music" }, { path: "/music", name: "music" },
{ path: "/writing", name: "writing" },
] ]
const inactiveClasses = "text-xl text-fg_light transition-all duration-300 hover:scale-[110%] hover:text-foreground align-middle"; const inactiveClasses = "text-xl text-fg_light transition-all duration-300 hover:scale-[110%] hover:text-foreground align-middle";
const activeClasses = "font-bold !text-foreground"; const activeClasses = "font-bold !text-accent drop-shadow-accent";
const Nav: Component = () => { const Nav: Component = () => {
@ -28,18 +28,15 @@ const Nav: Component = () => {
<nav class="pt-4 w-full flex flex-row justify-around"> <nav class="pt-4 w-full flex flex-row justify-around">
<For each={pages}>{ <For each={pages}>{
(page, _) => (page, _) =>
<a class={ <PageLink class={
(page.path == currentPage() || page.path + "/" == currentPage()) ? (page.path == currentPage() || page.path + "/" == currentPage()) ?
inactiveClasses + " " + activeClasses : inactiveClasses + " " + activeClasses :
inactiveClasses inactiveClasses
} }
href={page.path} href={page.path}
onClick={() => {
$currentPage.set(page.path);
}}
> >
{page.name} {page.name}
</a> </PageLink>
}</For> }</For>
</nav> </nav>
); );

View file

@ -11,7 +11,7 @@ import portrait from "@/assets/headshot_lg.jpg";
<Layout <Layout
title="J. Hunter DeLoche | About" title="J. Hunter DeLoche | About"
description="Hunter DeLoche is a biological sciences and music student at the University of Chicago. Additionally, he is a cadet in the Colleges Army ROTC program, intending to commission as a second lieutenant in the Medical Service Corps upon graduation." description="Hunter DeLoche is a freshman studying biological sciences and music at the University of Chicago. Additionally, he is a cadet in the Colleges Army ROTC program, intending to commission as a second lieutenant in the Medical Service Corps upon graduation."
> >
<div class="flex flex-col gap-10 md:flex-row items-center justify-around"> <div class="flex flex-col gap-10 md:flex-row items-center justify-around">
<div class="basis-5/12"> <div class="basis-5/12">
@ -24,47 +24,33 @@ import portrait from "@/assets/headshot_lg.jpg";
<div class="basis-1/2"> <div class="basis-1/2">
<SectionTitle>About Me</SectionTitle> <SectionTitle>About Me</SectionTitle>
<Paragraph> <Paragraph>
<Em>Hunter DeLoche</Em> is a biological sciences and music student at the <Em>Hunter DeLoche</Em> is a freshman studying biological sciences and music
University of Chicago. Additionally, he is a cadet in the Colleges Army at the University of Chicago. Additionally, he is a cadet in the Colleges
ROTC program, intending to commission as a second lieutenant in the Medical Army ROTC program, intending to commission as a second lieutenant in the
Service Corps upon graduation. Medical Service Corps upon graduation.
</Paragraph> </Paragraph>
<Paragraph> <Paragraph>
Hunter has a passion for the mind and its biological, psychological, and Hunter has a passion for the mind and its biological, psychological, and
cultural constituents. Upon completion of his military service, he cultural elements. Upon completion of his military service, he aspires
intends to attend medical school to become a psychiatrist. He hopes to to attend medical school to become a psychiatrist. He hopes to incite
incite positive change in the field through his patience, focus, and positive change in the field through his patience, focus, and passion
passion for genuine human connection. for genuine human connection.
</Paragraph> </Paragraph>
<Paragraph> <Paragraph>
Outside of school, Hunter enjoys composing and releasing music. He Outside of school, Hunter enjoys composing and releasing
formed his progressive rock band, Amnesium, as an outlet for his
compositions. Amnesiums debut album, <i>Event Horizon,</i> is a concept
album that envisions psychosis meshed with science fiction. To learn more
about his music, visit the
<Em> <Em>
<PageLink <PageLink
client:load client:load
href="/music" href="/music"
class="underline underline-offset-2 hover:underline-offset-4 transition-all duration-100" class="underline underline-offset-2 hover:underline-offset-4 transition-all duration-100"
> >
music page</PageLink music.</PageLink
>.
</Em>
</Paragraph>
<Paragraph>
Hunter also volunteers as a writing tutor for those working on their
college application process. For free writing advising and revision
services, visit the
<Em>
<PageLink
client:load
href="/writing"
class="underline underline-offset-2 hover:underline-offset-4 transition-all duration-100"
> >
writing page</PageLink
>.
</Em> </Em>
He formed his progressive rock band, Amnesium, as an outlet for his compositions.
Amnesiums debut album, <Em>Event Horizon,</Em> is a concept album that envisions
psychosis meshed with science fiction. <Em>Full Dark, No Stars,</Em>
will be released this summer (2024) as a part of his new project, Interalia.
</Paragraph> </Paragraph>
</div> </div>
</div> </div>

View file

@ -1,8 +1,47 @@
--- ---
import Layout from "@/layouts/Layout.astro"; import Layout from "@/layouts/Layout.astro";
import ScheduleButton from "@/components/ScheduleButton.astro"; import ScheduleButton from "@/components/ScheduleButton.astro";
import SectionTitle from "@/components/SectionTitle.astro";
import Paragraph from "@/components/Paragraph.astro";
import Em from "@/components/Em.astro";
import { Image } from "astro:assets";
import room from "@/assets/room.jpg";
--- ---
<Layout title="J. Hunter DeLoche | Music" description="music"> <Layout
<div class="">This is the music page</div> title="J. Hunter DeLoche | Music"
description="Hunter has been playing music for over 8 years. While he considers the electric guitar and bass as his main instruments, he also has experience singing and playing the drums. Additionally, he is proficient in using Ableton Live and Logic Pro to record, mix, and produce music. He considers Radiohead, The Mars Volta, and Nine Inch Nails to be his greatest musical inspirations."
>
<div class="flex flex-col gap-10 md:flex-row items-center justify-around">
<div class="basis-1/2">
<SectionTitle>Music Production</SectionTitle>
<Paragraph>
<Em>Hunter</Em> has been playing music for over 8 years. While he considers
the electric guitar and bass as his main instruments, he also has experience
singing and playing the drums. Additionally, he is proficient in using Ableton
Live and Logic Pro to record, mix, and produce music. He considers Radiohead,
The Mars Volta, and Nine Inch Nails to be his greatest musical inspirations.
</Paragraph>
<Paragraph>
Hunter is passionate about ever step of the music creation process. When
creating a peice of music, he has a focus on the balance and tone of
each instrument and sound. Often, he invents story concepts that drive
his musical compositions. In his album <Em>Event Horizon,</Em> the music
told the story of Atlas Corpus, a fictitious character in a mental institution.
He finds the arrangement of the sound and story to create a whole greater
than the sum of its parts to be the most rewarding aspect of composition.
</Paragraph>
</div>
<div class="basis-5/12">
<Image
class="rounded-md w-full border-accent border-[1px] drop-shadow-accent"
src={room}
alt="Hunter standing in his room with guitar."
/>
</div>
</div>
<!-- <ScheduleButton event_path="1-hour-music-lesson" -->
<!-- >Schedule a music lesson with Hunter</ScheduleButton -->
<!-- > -->
</Layout> </Layout>