me
/
ethanreece.com
Archived
1
0
Fork 0
Code Pull Requests Actions Activity

Add prettier and eslint

main
Ethan Reece 2023-05-24 15:37:12 -05:00
parent d96b630aee
commit 5eee44c205
Signed by: me
GPG Key ID: D3993665FF92E1C3
1 changed files with 75 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

148
src/pages/index.astro
View File

@ -1,81 +1,83 @@
--- ---
import Layout from '../layouts/Layout.astro'; import Layout from '../layouts/Layout.astro'
import Card from '../components/Card.astro'; import Card from '../components/Card.astro'
--- ---
<Layout title="Welcome to Astro."> <Layout title="Welcome to Astro.">
<main> <main>
<h1>Welcome to <span class="text-gradient">Astro</span></h1> <h1>Welcome to <span class="text-gradient">Astro</span></h1>
<p class="instructions"> <p class="instructions">
To get started, open the directory <code>src/pages</code> in your project.<br /> 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> <strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message
<ul role="list" class="link-card-grid"> above.
<Card </p>
href="https://docs.astro.build/" <ul role="list" class="link-card-grid">
title="Documentation" <Card
body="Learn how Astro works and explore the official API docs." href="https://docs.astro.build/"
/> title="Documentation"
<Card body="Learn how Astro works and explore the official API docs."
href="https://astro.build/integrations/" />
title="Integrations" <Card
body="Supercharge your project with new frameworks and libraries." href="https://astro.build/integrations/"
/> title="Integrations"
<Card body="Supercharge your project with new frameworks and libraries."
href="https://astro.build/themes/" />
title="Themes" <Card
body="Explore a galaxy of community-built starter themes." href="https://astro.build/themes/"
/> title="Themes"
<Card body="Explore a galaxy of community-built starter themes."
href="https://astro.build/chat/" />
title="Community" <Card
body="Come say hi to our amazing Discord community. ❤️" href="https://astro.build/chat/"
/> title="Community"
</ul> body="Come say hi to our amazing Discord community. ❤️"
</main> />
</ul>
</main>
</Layout> </Layout>
<style> <style>
main { main {
margin: auto; margin: auto;
padding: 1.5rem; padding: 1.5rem;
max-width: 60ch; max-width: 60ch;
} }
h1 { h1 {
font-size: 3rem; font-size: 3rem;
font-weight: 800; font-weight: 800;
margin: 0; margin: 0;
} }
.text-gradient { .text-gradient {
background-image: var(--accent-gradient); background-image: var(--accent-gradient);
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
background-size: 400%; background-size: 400%;
background-position: 0%; background-position: 0%;
} }
.instructions { .instructions {
line-height: 1.6; line-height: 1.6;
margin: 1rem 0; margin: 1rem 0;
border: 1px solid rgba(var(--accent), 25%); border: 1px solid rgba(var(--accent), 25%);
background-color: white; background-color: white;
padding: 1rem; padding: 1rem;
border-radius: 0.4rem; border-radius: 0.4rem;
} }
.instructions code { .instructions code {
font-size: 0.875em; font-size: 0.875em;
font-weight: bold; font-weight: bold;
background: rgba(var(--accent), 12%); background: rgba(var(--accent), 12%);
color: rgb(var(--accent)); color: rgb(var(--accent));
border-radius: 4px; border-radius: 4px;
padding: 0.3em 0.45em; padding: 0.3em 0.45em;
} }
.instructions strong { .instructions strong {
color: rgb(var(--accent)); color: rgb(var(--accent));
} }
.link-card-grid { .link-card-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr)); grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
gap: 1rem; gap: 1rem;
padding: 0; padding: 0;
} }
</style> </style>