chore: add vertical video + stories

example_vault/ATTRIBUTION.md

@@ -1,3 +1,5 @@
-- `video/video_wide.webm` is [**Sirui 35mm Anamorphic Lens TEST FOOTAGE (pure cinematography)** by *DreamDuo Films*][video_wide]
+- `video/video_wide.webm` is [**Sirui 35mm Anamorphic Lens TEST FOOTAGE (pure cinematography)** by _DreamDuo Films_][video_wide]
+- `video/video_vertical.webm` is [**free footage video background | portrait background** by _CahRusli_][video_vertical]
 
-[video_wide]: https://www.youtube.com/watch?v=rGVeryrPMEA
+[video_wide]: https://www.youtube.com/watch?v=rGVeryrPMEA
+[video_vertical]: https://www.youtube.com/shorts/QbhDvqZ50Lw

webui/src/stories/BlobPreview.stories.ts

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@storybook/svelte";
 import BlobPreview from "../components/display/BlobPreview.svelte";
-import { videoAddress } from "./common";
+import { videoAddress, videoVerticalAddress } from "./common";
 
 const meta: Meta<BlobPreview> = {
   title: "Blobs/BlobPreview",
@@ -16,3 +16,7 @@ type Story = StoryObj<BlobPreview>;
 export const Video: Story = {
   args: { address: videoAddress },
 };
+
+export const VideoVertical: Story = {
+  args: { address: videoVerticalAddress },
+};

webui/src/stories/BlobViewer.stories.ts

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@storybook/svelte";
 import BlobViewer from "../components/display/BlobViewer.svelte";
-import { videoAddress } from "./common";
+import { videoAddress, videoVerticalAddress } from "./common";
 
 const meta: Meta<BlobViewer> = {
   title: "Blobs/BlobViewer",
@@ -9,9 +9,9 @@ const meta: Meta<BlobViewer> = {
   argTypes: {
     detail: {
       control: {
-        type: "boolean"
-      }
-    }
+        type: "boolean",
+      },
+    },
   },
 };
 
@@ -22,3 +22,7 @@ type Story = StoryObj<BlobViewer>;
 export const Video: Story = {
   args: { address: videoAddress },
 };
+
+export const VideoVertical: Story = {
+  args: { address: videoVerticalAddress },
+};

webui/src/stories/common.ts

@@ -1 +1,2 @@
-export const videoAddress = "zQmeQHYJRniFnkFhG8fDNKQmwqHJW9rLyhX5WCnoDtg7wWa";
+export const videoAddress = "zQmeQHYJRniFnkFhG8fDNKQmwqHJW9rLyhX5WCnoDtg7wWa";
+export const videoVerticalAddress = "zQmfJtFbrckn8ZXFuEpL2tbaQGSjv7smTamd2TSTYQGidwt";

webui/yarn.lock

@@ -12560,8 +12560,8 @@ __metadata:
 
 "upend@file:../tools/upend_js::locator=upend-kestrel%40workspace%3A.":
   version: 0.0.1
-  resolution: "upend@file:../tools/upend_js#../tools/upend_js::hash=5f9304&locator=upend-kestrel%40workspace%3A."
-  checksum: afd8bbe8355922c2f16ddc302ebf1490f5f9ba7e201d81f3fedb48eccaf7007a9c4497e8087fa407b183e684e31fa29a886d98addb8f4c49ba1ec5fa0e60ede3
+  resolution: "upend@file:../tools/upend_js#../tools/upend_js::hash=b32491&locator=upend-kestrel%40workspace%3A."
+  checksum: 4e4e5c0a6498ad2ea8369a91e3c67c160186a96d47073469d61794c3717824198bd2de7851f3e0786833fa5f8c0eb85c65f7d7dc9c0114b9328b2a1060f645b2
   languageName: node
   linkType: hard