anton/pantosite
1
0
Fork 0
mirror of https://github.com/Pantonius/pantosite-astro.git synced 2026-04-26 17:34:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated styling

Browse Source
This commit is contained in:
Anton Pogrebnjak
2025-02-16 17:25:40 +01:00
parent 810280fd33
commit 9e02d262be
10 changed files with 152 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/pages/about.astro
View File

@@ -1,6 +1,7 @@
---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Main from "../components/Main.astro";
import Footer from "../components/Footer.astro";
import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
---
@@ -12,13 +13,13 @@ import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
</head>
<body>
<Header />
<main>
<Main>
<h1>Anton Pogrebnjak</h1>
<p>
Really, I don't have much to tell you about myself. Just look at the amazing stuff I've done and written about. That should suffice.
</p>
<p style="float: right; text-align: end;">Kind regards,<br>Anton</p>
</main>
</Main>
<Footer />
</body>

5
src/pages/blog/index.astro
View File

@@ -1,6 +1,7 @@
---
import BaseHead from '../../components/BaseHead.astro';
import Header from '../../components/Header.astro';
import Main from '../../components/Main.astro';
import Footer from '../../components/Footer.astro';
import { SITE_TITLE, SITE_DESCRIPTION } from '../../consts';
import { getCollection } from 'astro:content';
@@ -19,13 +20,13 @@ const posts: Post[] = (await getCollection('blog')).map(convertPost).sort(
</head>
<body>
<Header />
<main>
<Main>
{posts.length === 0 ? (
<h1 style="opacity: .5; user-select: none;">No posts yet &#128539;</h1>
) : (
<Showcase collection="blog" posts={posts} />
)}
</main>
</Main>
<Footer />
</body>
</html>

39
src/pages/index.astro
View File

@@ -1,6 +1,7 @@
---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Main from "../components/Main.astro";
import Footer from "../components/Footer.astro";
import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
import Showcase from "../components/Showcase.astro";
@@ -19,7 +20,7 @@ const posts: Post[] = (await getCollection("projects"))
</head>
<body>
<Header />
<main>
<Main>
<section id="welcome">
<h1>Hi &#128075;, my name is <a href="/about">Anton</a></h1>
<h2 class="typeout">
@@ -34,9 +35,9 @@ const posts: Post[] = (await getCollection("projects"))
</section>
<section id="projects">
<Showcase color="black" collection="projects" posts={posts} />
<Showcase color="var(--text)" collection="projects" posts={posts} />
</section>
</main>
</Main>
<Footer />
</body><script>
const typeout = document.querySelectorAll(".typeout");
@@ -58,13 +59,6 @@ const posts: Post[] = (await getCollection("projects"))
</script>
<style>
main {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
section {
padding: 2rem;
border-radius: .75em;
@@ -82,12 +76,9 @@ const posts: Post[] = (await getCollection("projects"))
}
#projects {
background-color: var(--primary);
color: var(--background);
}
#projects .title {
color: var(--background);
border: 2px solid var(--primary);
border-radius: .75em;
color: var(--text);
}
.buttons {
@@ -110,5 +101,21 @@ const posts: Post[] = (await getCollection("projects"))
background-color: var(--accent);
transition: background-color 0.2s;
}
@media (max-width: 720px) {
max-width: 100%;
section {
padding: 1rem;
}
#welcome h1 {
font-size: 1.5rem;
}
#welcome h2 {
font-size: 1rem;
}
}
</style>
</html>

5
src/pages/projects/index.astro
View File

@@ -1,6 +1,7 @@
---
import BaseHead from '../../components/BaseHead.astro';
import Header from '../../components/Header.astro';
import Main from '../../components/Main.astro';
import Footer from '../../components/Footer.astro';
import { SITE_TITLE, SITE_DESCRIPTION } from '../../consts';
import { getCollection } from 'astro:content';
@@ -19,13 +20,13 @@ const posts: Post[] = (await getCollection('projects')).map(convertPost).sort(
</head>
<body>
<Header />
<main>
<Main>
{posts.length === 0 ? (
<h1 style="opacity: .5; user-select: none;">No posts yet &#128539;</h1>
) : (
<Showcase collection="projects" posts={posts} />
)}
</main>
</Main>
<Footer />
</body>
</html>