github-such-software/such.software
1
0
Fork 0
mirror of https://github.com/Such-Software/such.software.git synced 2026-10-17 05:32:05 +02:00
Code Issues Packages Projects Releases Wiki Activity

bento: smirk wallet 3D coin vignette

Browse Source 
The flat lockup becomes a live tile: a 3D smirk coin (transparent, sg_outline inset ink,
dark rim) that rests smirk-up, tosses end-over-end on hover with the suchoice coin-flip
feel, lands $-up, and half-flips home for a seamless loop. 518KB webm + transparent
poster; web_qa gated.
This commit is contained in:
jwinterm
2026-07-12 08:27:30 -04:00
parent e1f7f3c49d
commit 20e0962fbc
3 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/public/showcase/vignettes/smirk.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 62 KiB

apps/web/public/showcase/vignettes/smirk.webm
BIN
View File
Binary file not shown.
apps/web/src/components/portfolio/bento-grid.tsx
+3 -1
View File
@@ -68,7 +68,9 @@ type Item = {
// Videos play on hover/focus on desktop and while on screen on no-hover (touch) devices. // Videos play on hover/focus on desktop and while on screen on no-hover (touch) devices.
const items: Item[] = [ const items: Item[] = [
{ name: "Webshops", tagline: "Custom storefronts we build and host. One platform, unlimited possibilities.", color: "emerald", span: 2, rows: 2, image: "/showcase/reels/webshops.jpg", alt: "Differently themed demo storefronts built on the same platform", href: "/products/webshops", vignette: { webm: "/showcase/reels/webshops.webm", poster: "/showcase/reels/webshops.jpg", mp4: "/showcase/reels/webshops.mp4", fit: "cover" } }, { name: "Webshops", tagline: "Custom storefronts we build and host. One platform, unlimited possibilities.", color: "emerald", span: 2, rows: 2, image: "/showcase/reels/webshops.jpg", alt: "Differently themed demo storefronts built on the same platform", href: "/products/webshops", vignette: { webm: "/showcase/reels/webshops.webm", poster: "/showcase/reels/webshops.jpg", mp4: "/showcase/reels/webshops.mp4", fit: "cover" } },
{ name: "Smirk Wallet", tagline: "Non-custodial browser wallet with social tipping.", color: "amber", span: 1, image: "/images/products/smirk-wallet.png", alt: "Smirk Wallet browser extension", href: "https://smirk.cash", external: true }, // 3D smirk coin (our engine + sg_outline inset ink): rests smirk-up, hover tosses it with a
// decelerating end-over-end tumble (the suchoice coin-flip feel), lands $-up, half-flips home.
{ name: "Smirk Wallet", tagline: "Non-custodial browser wallet with social tipping.", color: "amber", span: 1, image: "/images/products/smirk-wallet.png", alt: "Smirk Wallet browser extension", href: "https://smirk.cash", external: true, vignette: { webm: "/showcase/vignettes/smirk.webm", poster: "/showcase/vignettes/smirk.png" } },
// Transparent chroma-keyed vignette (the engine can't emit real alpha — BW_FLAT magenta key): // Transparent chroma-keyed vignette (the engine can't emit real alpha — BW_FLAT magenta key):
// full-bloom tree at rest, hover retracts and regrows it. Palindrome loop, seam 0.0. // full-bloom tree at rest, hover retracts and regrows it. Palindrome loop, seam 0.0.
{ name: "Bloomword", tagline: "A word game where every answer grows the tree.", color: "green", span: 1, image: "/images/products/bloomword.svg", alt: "Bloomword, a word game about growing a tree", href: "/products/bloomword", vignette: { webm: "/showcase/vignettes/bloomword.webm", poster: "/showcase/vignettes/bloomword.png" } }, { name: "Bloomword", tagline: "A word game where every answer grows the tree.", color: "green", span: 1, image: "/images/products/bloomword.svg", alt: "Bloomword, a word game about growing a tree", href: "/products/bloomword", vignette: { webm: "/showcase/vignettes/bloomword.webm", poster: "/showcase/vignettes/bloomword.png" } },