diff options
| author | Wolfgang Müller | 2025-02-26 14:57:17 +0100 |
|---|---|---|
| committer | Wolfgang Müller | 2025-02-26 14:57:17 +0100 |
| commit | d0951bf7c1729973c5c422d0ab88baefe6b74e87 (patch) | |
| tree | bd3a8face666ef44c458dd80178eba8dd7c761b4 | |
| parent | 6c116f03d0b233f7ac8e348b8d49e6a0178b1f45 (diff) | |
| download | hircine-d0951bf7c1729973c5c422d0ab88baefe6b74e87.tar.gz | |
frontend: Show URL in a textual representation in the details sidebar
Instead of hiding the URL behind a button with an icon, make it more
prominent as a full item in the details grid. The user can then interact
with it more directly.
| -rw-r--r-- | frontend/src/lib/tabs/ComicDetails.svelte | 24 |
1 files changed, 11 insertions, 13 deletions
diff --git a/frontend/src/lib/tabs/ComicDetails.svelte b/frontend/src/lib/tabs/ComicDetails.svelte index 887b7a5..89eb053 100644 --- a/frontend/src/lib/tabs/ComicDetails.svelte +++ b/frontend/src/lib/tabs/ComicDetails.svelte @@ -1,5 +1,5 @@ <script lang="ts"> - import type { ComicFilter, FullComicFragment } from '$gql/graphql'; + import { type ComicFilter, type FullComicFragment } from '$gql/graphql'; import { CategoryLabel, CensorshipLabel, LanguageLabel, RatingLabel } from '$lib/Enums'; import { href } from '$lib/Navigation'; import { formatListSize, joinText } from '$lib/Utils'; @@ -27,18 +27,6 @@ <div class="flex flex-col gap-4 text-sm"> <Header {title}> - {#if comic.url} - <a - href={comic.url} - target="_blank" - rel="noreferrer" - class="btn-slate" - title="Open URL" - aria-label="Open URL" - > - <span class="icon-base icon-[material-symbols--link]"></span> - </a> - {/if} <a href={`/archives/${comic.archive.id}`} class="btn-slate" @@ -85,6 +73,16 @@ </Section> </div> + {#if comic.url} + <Section title="URL"> + <a + class="ellipsis-nowrap transition-colors hover:text-white hover:underline" + rel="noreferrer" + href={comic.url}>{comic.url}</a + > + </Section> + {/if} + {#if comic.artists.length} <Section title="Artists"> {#each comic.artists as { id, name } (id)} |