albert/teoldalad
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

init

Browse source
This commit is contained in:
skidoodle 2024-03-13 00:30:45 +01:00
commit d761a10bf7
102 changed files with 4761 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

19
lib/components/bio/widgets/Discord/Status.svelte Normal file
View file

@ -0,0 +1,19 @@
<script lang="ts">
import statuses from '$lib/discord-statuses';
export let status: string;
export let activity: string | null | undefined = undefined;
const statusObject = statuses.find((x) => x.id == status);
</script>
{#if statusObject}
<span
class="font-medium text-[var(--color)] before:inline-block before:content-[''] before:w-3 before:h-3 before:min-w-[0.75rem] before:min-h-[0.75rem] before:bg-[var(--color)] before:rounded-full before:mr-1"
style="--color: {statusObject.color}">
{statusObject.text}
</span>
{#if activity}
and
{/if}
{/if}

40
lib/components/bio/widgets/DiscordUser.svelte Normal file
View file

@ -0,0 +1,40 @@
<script lang="ts">
import DiscordStatus from './Discord/Status.svelte';
import Panel from '../elements/Panel.svelte';
//@ts-ignore
export let data: WidgetDiscord;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<Panel preview={isPreview} {handle}>
<div class="flex flex-col gap-4">
<div class="flex justify-between items-center">
<div class="flex gap-4 items-center">
<div
class="avatar w-10 h-10 rounded-full bg-center bg-cover"
style={data.avatar ? `--avatar: url(${data.avatar})` : undefined} />
<p class="font-medium">@{data.username}</p>
</div>
<div>
<!-- TODO: Discord badges -->
</div>
</div>
{#if data.activity || data.status}
<p>
Currently <DiscordStatus status={data.status} activity={data.activity} />
{#if data.activity}
playing <span class="contents font-medium">{data.activity}</span>.
{/if}
</p>
{/if}
</div>
</Panel>
<style lang="postcss">
div.avatar {
@apply bg-accent;
background-image: var(--avatar);
}
</style>

15
lib/components/bio/widgets/ExternalSite.svelte Normal file
View file

@ -0,0 +1,15 @@
<script lang="ts">
import InteractivePanel from '../elements/InteractivePanel.svelte';
export let data: WidgetExternalSite;
export let nonInteractive: boolean = false;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<InteractivePanel preview={isPreview} url={!nonInteractive ? data.url : undefined} {handle}>
<div class="flex flex-col gap-1 justify-center">
<p class="text-lg line-clamp-1 break-all">{data.title || data.url}</p>
{#if data.title}<p class="text-secondary line-clamp-1 break-all">{data.url}</p>{/if}
</div>
</InteractivePanel>

17
lib/components/bio/widgets/InstagramPost.svelte Normal file
View file

@ -0,0 +1,17 @@
<script lang="ts">
import GenericSite from './types/GenericSite.svelte';
import InteractivePanel from '../elements/InteractivePanel.svelte';
import WidgetRenderContainer from '../elements/WidgetRenderContainer.svelte';
export let data: WidgetInstagramPost;
export let preview: WidgetPreviewInstagramPost | undefined = undefined;
export let nonInteractive: boolean = false;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<InteractivePanel preview={isPreview} title="Instagram Post" url={!nonInteractive ? data.url : undefined} {handle}>
<WidgetRenderContainer hasPreview={preview != null}>
<GenericSite thumbnail={preview?.thumbnail} title={preview?.author} description={preview?.description} />
</WidgetRenderContainer>
</InteractivePanel>

23
lib/components/bio/widgets/Markdown.svelte Normal file
View file

@ -0,0 +1,23 @@
<script lang="ts">
import Panel from '../elements/Panel.svelte';
export let data: WidgetMarkdown;
export let preview: WidgetRenderedMarkdown | undefined = undefined;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<Panel preview={isPreview} {handle}>
<div class="contents markdown">
{#key data}
{#key preview}
{#if preview}
<!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html preview.html}
{:else}
<p class="break-words whitespace-pre-line">{data.content.trim()}</p>
{/if}
{/key}
{/key}
</div>
</Panel>

17
lib/components/bio/widgets/PinterestPin.svelte Normal file
View file

@ -0,0 +1,17 @@
<script lang="ts">
import GenericSite from './types/GenericSite.svelte';
import InteractivePanel from '../elements/InteractivePanel.svelte';
import WidgetRenderContainer from '../elements/WidgetRenderContainer.svelte';
export let data: WidgetPinterestPin;
export let preview: WidgetPreviewPinterestPin | undefined = undefined;
export let nonInteractive: boolean = false;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<InteractivePanel preview={isPreview} title="Pinterest Pin" url={!nonInteractive ? data.url : undefined} {handle}>
<WidgetRenderContainer hasPreview={preview != null}>
<GenericSite thumbnail={preview?.thumbnail} title={preview?.title} description={preview?.description} />
</WidgetRenderContainer>
</InteractivePanel>

17
lib/components/bio/widgets/SoundCloudTrack.svelte Normal file
View file

@ -0,0 +1,17 @@
<script lang="ts">
import Track from './types/Track.svelte';
import InteractivePanel from '../elements/InteractivePanel.svelte';
import WidgetRenderContainer from '../elements/WidgetRenderContainer.svelte';
export let data: WidgetSoundCloudTrack;
export let preview: WidgetPreviewSoundCloudTrack | undefined = undefined;
export let nonInteractive: boolean = false;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<InteractivePanel preview={isPreview} title="SoundCloud Track" url={!nonInteractive ? data.url : undefined} {handle}>
<WidgetRenderContainer hasPreview={preview != null}>
<Track thumbnail={preview?.thumbnail} title={preview?.title} artist={preview?.authorName} />
</WidgetRenderContainer>
</InteractivePanel>

5
lib/components/bio/widgets/SpotifyNowPlaying.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
export let data: WidgetSpotifyNowPlaying;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>

13
lib/components/bio/widgets/Title.svelte Normal file
View file

@ -0,0 +1,13 @@
<script lang="ts">
import Panel from '../elements/Panel.svelte';
export let data: WidgetMarkdown;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<Panel preview={isPreview} invisible={true} {handle}>
<div class="px-6 py-3">
<p class="line-clamp-2 break-words font-semibold text-xl -mb-1 min-h-[28px]">{data.content}</p>
</div>
</Panel>

17
lib/components/bio/widgets/TwitchLive.svelte Normal file
View file

@ -0,0 +1,17 @@
<script lang="ts">
import GenericSite from './types/GenericSite.svelte';
import InteractivePanel from '../elements/InteractivePanel.svelte';
import WidgetRenderContainer from '../elements/WidgetRenderContainer.svelte';
export let data: WidgetTwitchLive;
export let preview: WidgetPreviewTwitchLive | undefined = undefined;
export let nonInteractive: boolean = false;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<InteractivePanel preview={isPreview} title="Twitch Live" url={!nonInteractive ? data.url : undefined} {handle}>
<WidgetRenderContainer hasPreview={preview != null}>
<GenericSite thumbnail={preview?.thumbnail} title={preview?.channel} description={preview?.description} />
</WidgetRenderContainer>
</InteractivePanel>

17
lib/components/bio/widgets/TwitterPost.svelte Normal file
View file

@ -0,0 +1,17 @@
<script lang="ts">
import GenericSite from './types/GenericSite.svelte';
import InteractivePanel from '../elements/InteractivePanel.svelte';
import WidgetRenderContainer from '../elements/WidgetRenderContainer.svelte';
export let data: WidgetTwitterPost;
export let preview: WidgetPreviewTwitterPost | undefined = undefined;
export let nonInteractive: boolean = false;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<InteractivePanel preview={isPreview} title="Twitter Post" url={!nonInteractive ? data.url : undefined} {handle}>
<WidgetRenderContainer hasPreview={preview != null}>
<GenericSite thumbnail={preview?.thumbnail} title={preview?.description} description={preview?.tag} />
</WidgetRenderContainer>
</InteractivePanel>

17
lib/components/bio/widgets/YouTubeVideo.svelte Normal file
View file

@ -0,0 +1,17 @@
<script lang="ts">
import GenericSite from './types/GenericSite.svelte';
import InteractivePanel from '../elements/InteractivePanel.svelte';
import WidgetRenderContainer from '../elements/WidgetRenderContainer.svelte';
export let data: WidgetYouTubeVideo;
export let preview: WidgetPreviewYouTubeVideo | undefined = undefined;
export let nonInteractive: boolean = false;
export let handle: boolean = false;
export let isPreview: boolean = false;
</script>
<InteractivePanel preview={isPreview} title="YouTube Video" url={!nonInteractive ? data.url : undefined} {handle}>
<WidgetRenderContainer hasPreview={preview != null}>
<GenericSite thumbnail={preview?.thumbnail} title={preview?.title} description={preview?.description} />
</WidgetRenderContainer>
</InteractivePanel>

15
lib/components/bio/widgets/types/GenericSite.svelte Normal file
View file

@ -0,0 +1,15 @@
<script lang="ts">
export let thumbnail: string | undefined = undefined;
export let title: string | undefined = undefined;
export let description: string | undefined = undefined;
</script>
<div class="flex flex-col gap-4">
{#if thumbnail}
<img class="widget-thumbnail rounded-xl" src={thumbnail} alt="Thumbnail" />
{/if}
<div class="flex flex-col gap-3">
<p class="break-words text-text-header line-clamp-2 font-bold">{title}</p>
<p class="break-words text-text-primary line-clamp-4">{description}</p>
</div>
</div>

15
lib/components/bio/widgets/types/Track.svelte Normal file
View file

@ -0,0 +1,15 @@
<script lang="ts">
export let thumbnail: string | undefined = undefined;
export let title: string | undefined = undefined;
export let artist: string | undefined = undefined;
</script>
<div class="flex gap-2 items-center">
{#if thumbnail}
<img class="widget-thumbnail h-14 rounded-xl" src={thumbnail} alt="Thumbnail" />
{/if}
<div class="flex flex-col justify-center w-full">
<p class="break-words text-text-header line-clamp-1 font-bold">{title}</p>
<p class="break-words text-text-primary line-clamp-1">{artist}</p>
</div>
</div>