0
mirror of https://github.com/valentineus/popov.link.git synced 2025-07-04 08:30:27 +03:00

feat: enhance accessibility and language support across components

- Updated various components to include `lang` attributes for improved accessibility and SEO.
- Introduced a new `env.d.ts` file to define environment variables for better type safety.
- Adjusted the print width in `.prettierrc.mjs` for improved code formatting.
- Streamlined the `Header`, `PostElement`, and `SocialLinks` components for better structure and clarity.
- Added language support to blog posts and updated the layout to reflect these changes.
This commit is contained in:
2025-06-11 17:49:14 +00:00
parent 423344fca5
commit 16fa8a3b5d
22 changed files with 52 additions and 27 deletions

View File

@ -3,9 +3,10 @@ import Layout from "../layouts/BaseLayout.astro";
const title = "404 — Page Not Found | Valentin Popov";
const description = "The page you're looking for doesn't exist!";
const lang = "en";
---
<Layout title={title} description={description}>
<Layout title={title} description={description} lang={lang}>
<div style="text-align:center;">
<h1>404</h1>
<p><strong>Page not found</strong></p>

View File

@ -24,6 +24,7 @@ const { Content, remarkPluginFrontmatter } = await post.render();
const date = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY");
const title = `${post.data.title} | Valentin Popov`;
const description = post.data.description;
const lang = post.data.lang;
---
<style lang="scss">
@ -34,7 +35,7 @@ const description = post.data.description;
}
</style>
<Layout title={title} description={description}>
<Layout title={title} description={description} lang={lang}>
<article>
<section>
<h1>{post.data.title}</h1>
@ -44,7 +45,7 @@ const description = post.data.description;
<p>
<small>
Posted
<time datetime={post.data.pubDate.toISOString()}>{date}</time>
<time datetime={post.data.pubDate.toISOString()} lang="en">{date}</time>
by&nbsp;{post.data.author}
<span>&nbsp;•&nbsp;</span>
<span>{remarkPluginFrontmatter.minutesRead}</span>

View File

@ -4,8 +4,9 @@ import { getCollection } from "astro:content";
import Layout from "../../layouts/BaseLayout.astro";
import PostElement from "../../components/PostElement.astro";
const title = "Blog | Valentin Popov";
const description = "A collection of articles on software development, tech leadership and open-source experiments.";
const title = "Valentin Popov's Blog | Software Development, Leadership & Open-Source";
const description = "Explore Valentin Popov's blog on software development, tech leadership, and open-source experiments. Stay updated with in-depth tutorials and expert insights.";
const lang = "en";
const posts = await getCollection("blog", ({ data }) => {
return data.draft !== true;
@ -25,12 +26,16 @@ const postsByYear = posts.reduce<Record<string, CollectionEntry<"blog">[]>>((acc
const years = Object.keys(postsByYear).sort((a, b) => Number(b) - Number(a));
---
<Layout title={title} description={description}>
<Layout title={title} description={description} lang={lang}>
<section>
<h1>Blog posts</h1>
</section>
<section style={{ "margin-top": "3rem" }}>
{
years.map((year) => (
<div>
<div style={{ "margin-bottom": "1rem" }}>{year}</div>
<h2>{year}</h2>
<ul>
{postsByYear[year].map((post) => (
<PostElement post={post} />

View File

@ -10,7 +10,7 @@ export async function GET(context) {
});
return rss({
customData: `<language>ru-ru</language>`,
customData: `<language>en</language>`,
description: description,
items: posts.map((post) => ({
customData: post.data.customData,

View File

@ -4,11 +4,12 @@ import LatestPostsSection from "../components/Sections/LatestPosts.astro";
import SocialLinksSection from "../components/Sections/SocialLinks.astro";
import WelcomeSection from "../components/Sections/Welcome.astro";
const title = "Valentin Popov";
const description = "A personal website of Valentin Popov, a software developer and team lead.";
const title = "Valentin Popov Software Developer & Team Lead | Tech Insights";
const description = "Valentin Popov is an experienced project manager and team lead sharing expert insights on software development, leadership, and digital innovation.";
const lang = "en";
---
<Layout title={title} description={description}>
<Layout title={title} description={description} lang={lang}>
<WelcomeSection />
<SocialLinksSection />
<LatestPostsSection />