badmanners/gallery.badmanners.xyz
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add Tippy.js tooltips to focusable elements

Browse source
This commit is contained in:
Bad Manners 2024-09-07 18:28:08 -03:00
parent a2fbf908aa
commit 09934a9f8e
No known key found for this signature in database
GPG key ID: 8C88292CCB075609
11 changed files with 73 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/pages/games.astro
View file

@ -30,6 +30,7 @@ const games = await Promise.all(
class="u-url text-link hover:underline focus:underline"
href={`/games/${game.slug}`}
title={t(game.data.lang, "game/warnings", game.data.platforms, game.data.contentWarning)}
data-clipboard={t(game.data.lang, "game/warnings", game.data.platforms, game.data.contentWarning)}
>
{game.data.thumbnail ? (
<div class="flex aspect-[630/500] max-w-[288px] justify-center">

7
src/pages/index.astro
View file

@ -102,7 +102,12 @@ const latestItems: LatestItemsEntry[] = await Promise.all(
{
latestItems.map((entry) => (
<li class="h-entry break-inside-avoid" lang={entry.lang}>
<a class="u-url text-link hover:underline focus:underline" href={entry.href} title={entry.altText}>
<a
class="u-url text-link hover:underline focus:underline"
href={entry.href}
title={entry.altText}
data-clipboard={entry.altText}
>
{entry.thumbnail ? (
<div class="flex aspect-square max-w-[192px] justify-center">
<Image

1
src/pages/stories/[page].astro
View file

@ -88,6 +88,7 @@ const totalPages = Math.ceil(page.total / page.size);
class="u-url text-link hover:underline focus:underline"
href={`/stories/${story.slug}`}
title={t(story.data.lang, "story/warnings", story.data.wordCount, story.data.contentWarning)}
data-clipboard={t(story.data.lang, "story/warnings", story.data.wordCount, story.data.contentWarning)}
>
{story.data.thumbnail ? (
<div class="flex aspect-square max-w-[192px] justify-center">

1
src/pages/tags.astro
View file

@ -102,6 +102,7 @@ if (uncategorizedTagsSet.size > 0) {
class="rounded-full bg-bm-300 px-3 py-1 text-sm text-black shadow-sm hover:underline focus:underline dark:bg-bm-600 dark:text-white"
href={`/tags/${id}`}
title={description}
data-clipboard={description}
>
{name}
</a>