Add components for home page
parent
c0a371b510
commit
7b406fb8a1
|
@ -0,0 +1,18 @@
|
|||
---
|
||||
const homeText = 'Ethan Reece'
|
||||
const links = [
|
||||
{ text: 'About Me', link: '/#about' },
|
||||
{ text: 'Projects', link: '/#projects' },
|
||||
{ text: 'Experience', link: '/#experience' },
|
||||
{ text: 'Hobbies', link: '/#hobbies' },
|
||||
{ text: 'Contact Me', link: '/#contact' },
|
||||
]
|
||||
---
|
||||
|
||||
<div class="w-full bg-background-light px-screen-x py-screen-y">
|
||||
<ul role="list" class="flex w-full space-x-screen-x whitespace-nowrap">
|
||||
<a href="/">{homeText}</a>
|
||||
<li class="w-full"></li>
|
||||
{links.map((link) => <a href={link.link}>{link.text}</a>)}
|
||||
</ul>
|
||||
</div>
|
|
@ -0,0 +1,11 @@
|
|||
---
|
||||
export interface Props {
|
||||
background: boolean
|
||||
}
|
||||
|
||||
const { background } = Astro.props
|
||||
---
|
||||
|
||||
<div class={background ? 'bg-background-dark' : ''}>
|
||||
<slot />
|
||||
</div>
|
|
@ -1,18 +0,0 @@
|
|||
---
|
||||
const homeText = 'Ethan Reece'
|
||||
const links = [
|
||||
{ text: 'About Me', link: '#about' },
|
||||
{ text: 'Projects', link: '#projects' },
|
||||
{ text: 'Experience', link: '#experience' },
|
||||
{ text: 'Hobbies', link: '#hobbies' },
|
||||
{ text: 'Contact Me', link: '#contact' },
|
||||
]
|
||||
---
|
||||
|
||||
<div class="w-full bg-background-light px-screen-x py-screen-y">
|
||||
<ul role="list" class="text flex w-full space-x-screen-x whitespace-nowrap">
|
||||
<a href="/">{homeText}</a>
|
||||
<li class="w-full"></li>
|
||||
{links.map((link) => <a href={link.link}>{link.text}</a>)}
|
||||
</ul>
|
||||
</div>
|
|
@ -2,7 +2,7 @@
|
|||
import Background from './properties/Background.astro'
|
||||
import Font from './properties/Font.astro'
|
||||
import Head from './properties/Head.astro'
|
||||
import Navbar from '../content/global/Navbar.astro'
|
||||
import Navbar from '../components/content/global/Navbar.astro'
|
||||
|
||||
export interface Props {
|
||||
title: string
|
|
@ -1,38 +1,7 @@
|
|||
---
|
||||
import Layout from '../layouts/Basic.astro'
|
||||
import Card from '../components/Card.astro'
|
||||
import Base from '../layouts/Base.astro'
|
||||
---
|
||||
|
||||
<Layout title="Ethan Reece" description="">
|
||||
<main>
|
||||
<h1>Welcome to <span>Astro</span></h1>
|
||||
<p>
|
||||
To get started, open the directory <code>src/pages</code> in your project.<br
|
||||
/>
|
||||
<strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message
|
||||
above.
|
||||
</p>
|
||||
<ul role="list">
|
||||
<Card
|
||||
href="https://docs.astro.build/"
|
||||
title="Documentation"
|
||||
body="Learn how Astro works and explore the official API docs."
|
||||
/>
|
||||
<Card
|
||||
href="https://astro.build/integrations/"
|
||||
title="Integrations"
|
||||
body="Supercharge your project with new frameworks and libraries."
|
||||
/>
|
||||
<Card
|
||||
href="https://astro.build/themes/"
|
||||
title="Themes"
|
||||
body="Explore a galaxy of community-built starter themes."
|
||||
/>
|
||||
<Card
|
||||
href="https://astro.build/chat/"
|
||||
title="Community"
|
||||
body="Come say hi to our amazing Discord community. ❤️"
|
||||
/>
|
||||
</ul>
|
||||
</main>
|
||||
</Layout>
|
||||
<Base title="Ethan Reece" description="">
|
||||
<p>hello world</p>
|
||||
</Base>
|
||||
|
|
Reference in New Issue