From 162296bfe079d2b911883a8f930cfc56e12cf1cb Mon Sep 17 00:00:00 2001 From: JasterV <49537445+JasterV@users.noreply.github.com> Date: Mon, 2 Jun 2025 14:33:33 +0200 Subject: [PATCH] [fix] Typescript types --- src/components/Header.astro | 91 +++++++++++++++++++++++++++++++ src/layouts/BaseLayout.astro | 99 ++-------------------------------- src/layouts/PostLayout.astro | 2 +- src/pages/blog/[...slug].astro | 4 +- src/pages/blog/index.astro | 4 +- 5 files changed, 100 insertions(+), 100 deletions(-) create mode 100644 src/components/Header.astro diff --git a/src/components/Header.astro b/src/components/Header.astro new file mode 100644 index 0000000..4f69538 --- /dev/null +++ b/src/components/Header.astro @@ -0,0 +1,91 @@ +--- +import { Image } from "astro:assets"; +import { Icon } from "astro-icon/components"; +import profileImage from "@assets/profile.jpeg"; +--- + +
+ + +
+ +
+ profile image +
+ +
+

Victor Martinez

+

/* Be a catalyst for change */

+
+
+
+ + diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index bd267ca..a398e30 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -1,20 +1,16 @@ --- import type { ImageMetadata } from "astro"; -import { getImage, Image } from "astro:assets"; -import profileImage from "@assets/profile.jpeg"; -import { Icon } from "astro-icon/components"; - +import { getImage } from "astro:assets"; +import Header from "@components/Header.astro"; import "@styles/global.scss"; interface Props { - title?: string; + title: string; backgroundImage: ImageMetadata; } const { title, backgroundImage } = Astro.props; - const optimizedBgImage = await getImage({ src: backgroundImage }); - const backgroundImageUrl = `url('${optimizedBgImage.src}')`; --- @@ -28,38 +24,7 @@ const backgroundImageUrl = `url('${optimizedBgImage.src}')`;
-
- - -
- -
- profile image -
- -
-

Victor Martinez

-

/* Be a catalyst for change */

-
-
-
+
@@ -118,60 +83,4 @@ const backgroundImageUrl = `url('${optimizedBgImage.src}')`; margin-top: auto; gap: 0.5rem; } - - .description { - color: var(--text-color-light); - font-size: 0.9rem; - padding-top: 0.25rem; - } - - nav { - padding-top: 0.3rem; - display: flex; - flex-direction: row; - gap: 0.5rem; - } - - .profile { - display: flex; - flex-direction: row; - gap: 1.5rem; - align-items: start; - } - - .profile-image-wrapper { - width: 50px; - height: 50px; - border: 2px solid white; - border-radius: 50%; - position: relative; - overflow: hidden; - } - - .profile-image-wrapper:hover { - border-color: var(--violet300); - cursor: pointer; - } - - .profile-image { - width: 100%; - height: auto; - margin-top: -35%; - } - - header { - display: flex; - flex-direction: column; - gap: 1rem; - margin-bottom: 1rem; - } - - @media screen and (min-width: 636px) { - header { - flex-direction: row-reverse; - align-items: start; - justify-content: space-between; - gap: 0.25rem; - } - } diff --git a/src/layouts/PostLayout.astro b/src/layouts/PostLayout.astro index 3b949e3..923daa4 100644 --- a/src/layouts/PostLayout.astro +++ b/src/layouts/PostLayout.astro @@ -10,7 +10,7 @@ type Props = CollectionEntry<"blog">["data"]; const { title, pubDate, image } = Astro.props; --- - +
Header pic diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro index b61d002..00e90c4 100644 --- a/src/pages/blog/[...slug].astro +++ b/src/pages/blog/[...slug].astro @@ -3,8 +3,8 @@ import { type CollectionEntry, getCollection } from "astro:content"; import PostLayout from "../../layouts/PostLayout.astro"; import { render } from "astro:content"; -type Props = CollectionEntry<"Blog">; -type Post = CollectionEntry<"Blog">; +type Props = CollectionEntry<"blog">; +type Post = CollectionEntry<"blog">; export async function getStaticPaths() { const posts = await getCollection("blog"); diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro index 414c113..0588113 100644 --- a/src/pages/blog/index.astro +++ b/src/pages/blog/index.astro @@ -4,7 +4,7 @@ import backgroundImage from "@assets/blog-bg.jpg"; import { type CollectionEntry, getCollection } from "astro:content"; import FormattedDate from "@components/FormattedDate.astro"; -type PostEntry = CollectionEntry<"Blog">; +type PostEntry = CollectionEntry<"blog">; const posts: PostEntry[] = await getCollection("blog"); @@ -13,7 +13,7 @@ const sortedPosts = posts.sort( ); --- - +
{ sortedPosts.map((post) => (