ruidy/orbital-orbit
1
0
Fork 0
mirror of https://github.com/rjNemo/orbital-orbit synced 2026-06-10 01:36:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add dynamic details

Browse source
This commit is contained in:
Ruidy 2024-12-31 01:15:16 +01:00
parent fdb0f25e54
commit 01274c92bc
No known key found for this signature in database
GPG key ID: E00F51288CB857CC
3 changed files with 63 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
src/pages/about.astro
View file

@ -1,5 +1,28 @@
---
const pageTitle = "About Me"
const identity = {
firstName: "Ruidy",
age: 30,
occupation: "Software Developer",
location: "Germany",
interests: ["Astro", "Web Development", "Learning in Public"],
}
const skills = [
"HTML",
"CSS",
"JavaScript",
"React",
"TypeScript",
"Node.js",
"Git",
"Astro",
]
const happy = true
const finished = true
const goal = 3
---
<html lang="en">
@ -8,16 +31,48 @@
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
<title>{pageTitle}</title>
<style>
h1 {
color: purple;
font-size: 4rem;
}
.skill {
color: green;
font-weight: bold;
}
</style>
</head>
<body>
<a href="/">Home</a>
<a href="/about">About</a>
<a href="/blog">Blog</a>
<h1>About me</h1>
<h1>{pageTitle}</h1>
<h2>... and my new website!</h2>
<p>I'm a web developer and I'm learning Astro.</p>
<p>This is my first website!</p>
<h2>A few things about me:</h2>
<ul>
<li> I'm {identity.firstName}. </li>
<li>I'm {identity.age} years old.</li>
<li>I'm a {identity.occupation} in {identity.location}.</li>
<li>I'm interested in {identity.interests.join(", ")}.</li>
</ul>
<p> My skills are:</p>
<ul>
{skills.map((skill) => (
<li class="skill">{skill}</li>
))}
</ul>
{happy && <p>I am happy to be learning Astro!</p>}
{finished && <p>I finished this tutorial!</p>}
{goal === 3 ? <p>My goal is to finish in 3 days.</p> : <p>My goal is not 3 days.</p>}
</body>
</html>

5
src/pages/blog.astro
View file

@ -1,4 +1,5 @@
---
const pageTitle = "Blog posts"
---
@ -8,7 +9,7 @@
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
<title>{pageTitle}</title>
</head>
<body>
<a href="/">Home</a>
@ -17,7 +18,7 @@
<h1>Blog posts</h1>
<h1>{pageTitle}</h1>
<p>This is a list of my blog posts.</p>
<ul>

6
src/pages/index.astro
View file

@ -1,5 +1,5 @@
---
const pageTitle = "Orbital Orbit"
---
<html lang="en">
@ -8,13 +8,13 @@
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
<title>{pageTitle}</title>
</head>
<body>
<a href="/">Home</a>
<a href="/about">About</a>
<a href="/blog">Blog</a>
<h1>Orbital Orbit</h1>
<h1>{pageTitle}</h1>
</body>
</html>