cdransf/coryd.dev-astro
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: link display in blogroll table

Browse source
This commit is contained in:
Cory Dransfeldt 2024-11-22 04:50:28 -08:00
parent b33f318e80
commit f289c3d3d0
No known key found for this signature in database
1 changed files with 40 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
src/pages/blogroll.astro
View file

@ -1,16 +1,9 @@
--- ---
import Layout from "@layouts/Layout.astro"; import Layout from "@layouts/Layout.astro";
import icons from "@cdransf/astro-tabler-icons";
import { fetchBlogroll } from "@utils/data/blogroll.js"; import { fetchBlogroll } from "@utils/data/blogroll.js";
export const prerender = true; export const prerender = true;
const {
IconRss,
IconJson,
IconMailPlus,
IconBrandMastodon,
} = icons;
const blogroll = await fetchBlogroll(); const blogroll = await fetchBlogroll();
const title = "Blogroll"; const title = "Blogroll";
const description = const description =
@ -24,10 +17,8 @@ const description =
> >
<h2 class="page-title">{title}</h2> <h2 class="page-title">{title}</h2>
<p> <p>
You can <a You can <a href="/blogroll.opml">download an OPML file</a> containing all of
href="/blogroll.opml" these feeds and import them into your RSS reader.
>download an OPML file</a
> containing all of these feeds and import them into your RSS reader.
</p> </p>
<table> <table>
<thead> <thead>
@ -45,43 +36,44 @@ const description =
<td> <td>
<a href={blog.url}>{blog.url.replace("https://", "")}</a> <a href={blog.url}>{blog.url.replace("https://", "")}</a>
</td> </td>
<td class="blog-roll-icons"> <td>
{blog.rss_feed && ( {[
blog.rss_feed && (
<a <a
class="rss" class="rss"
href={blog.rss_feed} href={blog.rss_feed}
aria-label={`RSS feed for ${blog.name}`} aria-label={`RSS feed for ${blog.name}`}
> >RSS</a>
<div set:html={IconRss({ size: 16 })}/> ),
</a> blog.json_feed && (
)}
{blog.json_feed && (
<a <a
class="json" class="json"
href={blog.json_feed} href={blog.json_feed}
aria-label={`JSON feed for ${blog.name}`} aria-label={`JSON feed for ${blog.name}`}
> >JSON</a>
<div set:html={IconJson({ size: 16 })}/> ),
</a> blog.newsletter && (
)}
{blog.newsletter && (
<a <a
class="mail-plus" class="mail-plus"
href={blog.newsletter} href={blog.newsletter}
aria-label={`Subscribe to ${blog.name}'s newsletter`} aria-label={`Subscribe to ${blog.name}'s newsletter`}
> >Newsletter</a>
<div set:html={IconMailPlus({ size: 16 })}/> ),
</a> blog.mastodon && (
)}
{blog.mastodon && (
<a <a
class="brand-mastodon" class="brand-mastodon"
href={blog.mastodon} href={blog.mastodon}
aria-label={`Follow ${blog.name} on Mastodon`} aria-label={`Follow ${blog.name} on Mastodon`}
> >Mastodon</a>
<div set:html={IconBrandMastodon({ size: 16 })}/> ),
</a> ]
)} .filter(Boolean)
.map((link, index, array) => (
<>
{link}
{index < array.length - 1 && " / "}
</>
))}
</td> </td>
</tr> </tr>
)) ))