Various style tweaks

This commit is contained in:
Pieter Vander Vennet 2024-07-11 19:01:32 +02:00
parent d5430891bf
commit ed9e59109e
12 changed files with 128 additions and 112 deletions

View file

@ -3,14 +3,11 @@
import { Store } from "../../Logic/UIEventSource"
import FromHtml from "../Base/FromHtml.svelte"
import Loading from "../Base/Loading.svelte"
import { Disclosure, DisclosureButton, DisclosurePanel } from "@rgossiaux/svelte-headlessui"
import { ChevronRightIcon } from "@rgossiaux/svelte-heroicons/solid"
import ToSvelte from "../Base/ToSvelte.svelte"
import WikidataPreviewBox from "./WikidataPreviewBox"
import Tr from "../Base/Tr.svelte"
import Translations from "../i18n/Translations"
import Wikipedia from "../../assets/svg/Wikipedia.svelte"
import Wikidatapreview from "./Wikidatapreview.svelte"
import AccordionSingle from "../Flowbite/AccordionSingle.svelte"
/**
* Shows a wikipedia-article + wikidata preview for the given item
@ -21,40 +18,33 @@
)
</script>
{#if $titleOnly}
<Loading>{$wikipediaDetails.title}</Loading>
{/if}
{#if $wikipediaDetails.articleUrl}
<a class="flex" href={$wikipediaDetails.articleUrl} rel="noreferrer" target="_blank">
<Wikipedia class="h-6 w-6" />
<Tr t={Translations.t.general.wikipedia.fromWikipedia} />
</a>
{/if}
{#if $wikipediaDetails.wikidata}
<Wikidatapreview wikidata={$wikipediaDetails.wikidata} />
{/if}
{#if $wikipediaDetails.articleUrl}
{#if $wikipediaDetails.firstParagraph === "" || $wikipediaDetails.firstParagraph === undefined}
<Loading>
<Tr t={Translations.t.general.wikipedia.loading} />
</Loading>
{:else}
<FromHtml clss="wikipedia-article" src={$wikipediaDetails.firstParagraph} />
<Disclosure let:open>
<DisclosureButton>
<span class="flex">
<ChevronRightIcon
style={(open ? "transform: rotate(90deg); " : "") +
" transition: all .25s linear; width: 1.5rem; height: 1.5rem"}
/>
<Tr t={Translations.t.general.wikipedia.readMore} />
</span>
</DisclosureButton>
<DisclosurePanel>
<FromHtml clss="wikipedia-article" src={$wikipediaDetails.restOfArticle} />
</DisclosurePanel>
</Disclosure>
<div class="low-interaction border-gray-300 border-dashed rounded-xl p-2 flex flex-col">
{#if $titleOnly}
<Loading>{$wikipediaDetails.title}</Loading>
{/if}
{/if}
{#if $wikipediaDetails.wikidata}
<Wikidatapreview wikidata={$wikipediaDetails.wikidata} />
{/if}
{#if $wikipediaDetails.articleUrl}
{#if $wikipediaDetails.firstParagraph === "" || $wikipediaDetails.firstParagraph === undefined}
<Loading>
<Tr t={Translations.t.general.wikipedia.loading} />
</Loading>
{:else}
<FromHtml clss="wikipedia-article" src={$wikipediaDetails.firstParagraph} />
{#if $wikipediaDetails.articleUrl}
<a class="flex self-end my-2" href={$wikipediaDetails.articleUrl} rel="noreferrer" target="_blank">
<Wikipedia class="h-6 w-6" />
<Tr t={Translations.t.general.wikipedia.fromWikipedia} />
</a>
{/if}
<AccordionSingle>
<Tr slot="header" t={Translations.t.general.wikipedia.readMore} />
<FromHtml clss="wikipedia-article" src={$wikipediaDetails.restOfArticle} />
</AccordionSingle>
{/if}
{/if}
</div>