summaryrefslogtreecommitdiff
path: root/src/components/jet/today-card/TodayCardOverlay.svelte
diff options
context:
space:
mode:
authorrxliuli <rxliuli@gmail.com>2025-11-04 05:03:50 +0800
committerrxliuli <rxliuli@gmail.com>2025-11-04 05:03:50 +0800
commitbce557cc2dc767628bed6aac87301a1be7c5431b (patch)
treeb51a051228d01fe3306cd7626d4a96768aadb944 /src/components/jet/today-card/TodayCardOverlay.svelte
init commit
Diffstat (limited to 'src/components/jet/today-card/TodayCardOverlay.svelte')
-rw-r--r--src/components/jet/today-card/TodayCardOverlay.svelte48
1 files changed, 48 insertions, 0 deletions
diff --git a/src/components/jet/today-card/TodayCardOverlay.svelte b/src/components/jet/today-card/TodayCardOverlay.svelte
new file mode 100644
index 0000000..4e3c405
--- /dev/null
+++ b/src/components/jet/today-card/TodayCardOverlay.svelte
@@ -0,0 +1,48 @@
+<script lang="ts" context="module">
+ import type {
+ TodayCardOverlay,
+ TodayCardLockupOverlay,
+ } from '@jet-app/app-store/api/models';
+
+ export function isLockupOverlay(
+ overlay: TodayCardOverlay,
+ ): overlay is TodayCardLockupOverlay {
+ return overlay.kind === 'lockup';
+ }
+</script>
+
+<script lang="ts">
+ import TodayCardLockupListOverlay, {
+ isLockupListOverlay,
+ } from '~/components/jet/today-card/overlay/TodayCardLockupListOverlay.svelte';
+ import SmallLockupItem from '~/components/jet/item/SmallLockupItem.svelte';
+
+ export let overlay: TodayCardOverlay;
+ export let buttonVariant: 'gray' | 'blue' | 'transparent' = 'transparent';
+</script>
+
+{#if isLockupOverlay(overlay)}
+ <div class="small-lockup-item-config">
+ <SmallLockupItem
+ {buttonVariant}
+ item={overlay.lockup}
+ titleLineCount={1}
+ appIconProfile="app-icon"
+ />
+ </div>
+{:else if isLockupListOverlay(overlay)}
+ <TodayCardLockupListOverlay {overlay} />
+{/if}
+
+<style>
+ .small-lockup-item-config {
+ --title-color: var(--text-color, currentColor);
+ --subtitle-color: var(--text-accent-color, currentColor);
+ --linkColor: currentColor;
+ --eyebrow-color: var(--text-accent-color, currentColor);
+ --button-blend-mode: var(--text-accent-blend-mode);
+ --subtitle-blend-mode: var(--text-accent-blend-mode);
+ --eyebrow-blend-mode: var(--text-accent-blend-mode);
+ display: contents;
+ }
+</style>