Curated by Mahj Jen · @mahjjen

The Weekly Mahjong Drop

\n Hand-picked mahjong tiles, racks, bags, and accessories — fresh finds\n each week, one convenient spot.\n

\n This week's drop window\n {{DROP_WINDOW}}\n

\n See what's dropping\n

\n\n

Featured This Week

\n Tap through to the shops. Each drop is hand-selected — a new mix\n every week.\n

\n\n

\n \n Tiles & more\n

Peace Love Mahjong

Racks, bags, and accessories with a retro vibe.

\n Visit shop →\n \n\n \n Free shipping via my link\n

Mise en Mahjong

Beautiful tiles and essentials, styled and fresh.

\n Visit shop →\n \n\n

\n Your drop here\n

Next week's pick

Swap this card for your next featured shop.

\n Edit index.html →\n

\n\n

Exclusive Promo Codes

\n Mahj Jen's drop\n MAHJJEN\n saves 10%\n

\n Britt Mills Design\n 15% off\n applies in-cart\n

\n Mise en Mahjong: use the\n free shipping link.\n

\n\n \n \n\n",2,["D",1787339978625],"branchVersion","label",[18],"pulls","branches",1,"forks","envVars",{"_175":169,"_177":26},"connections",{"_175":26,"_176":26},"count","unfilledCount","emptyCount",{"_34":213,"_13":214,"_64":215,"_44":-5,"_36":37,"_164":216,"_187":101,"_38":217,"_40":26,"_66":21,"_160":218,"_67":24,"_165":-5,"_190":219,"_17":220},{"_34":205,"_13":206,"_64":207,"_44":-5,"_36":37,"_164":208,"_187":101,"_38":209,"_40":26,"_66":21,"_160":210,"_67":24,"_165":-5,"_190":211,"_17":212},{"_34":159,"_13":18,"_64":65,"_44":-5,"_36":37,"_164":80,"_187":101,"_38":202,"_40":162,"_66":21,"_160":161,"_67":24,"_165":-5,"_190":203,"_17":204},{"_34":193,"_13":194,"_64":99,"_44":-5,"_36":37,"_164":124,"_187":101,"_38":195,"_40":196,"_66":197,"_160":198,"_67":24,"_165":199,"_190":200,"_17":201},{"_34":183,"_13":184,"_64":185,"_44":-5,"_36":37,"_164":186,"_187":101,"_38":188,"_40":26,"_66":21,"_160":189,"_67":24,"_165":-5,"_190":191,"_17":192},"fa5c1c24-9e76-463a-980b-32bee0cb9931","style.css","6e41fea6-9d88-11f1-8eb0-1607ee4eb77e",5,"latest",["D",1787334471601],":root {\n --felt: #1f4d3a;\n --felt-dark: #16382a;\n --ivory: #f7f3e8;\n --cream: #fbf8f0;\n --ink: #2b241c;\n --gold: #c9a227;\n --red: #a7282a;\n --muted: #6b6257;\n}\n\n* {\n box-sizing: border-box;\n}\n\nhtml {\n scroll-behavior: smooth;\n}\n\nbody {\n margin: 0;\n font-family: Georgia, \"Times New Roman\", serif;\n color: var(--ink);\n background: var(--ivory);\n line-height: 1.55;\n}\n\na {\n color: inherit;\n}\n\n.wrap {\n max-width: 1080px;\n margin: 0 auto;\n padding: 0 1.25rem;\n}\n\n/* ---------- Header ---------- */\n.site-header {\n background: var(--felt);\n color: var(--ivory);\n position: sticky;\n top: 0;\n z-index: 20;\n box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);\n}\n\n.site-header .wrap {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n padding-top: 0.8rem;\n padding-bottom: 0.8rem;\n flex-wrap: wrap;\n}\n\n.brand {\n display: flex;\n align-items: center;\n gap: 0.6rem;\n font-size: 1.15rem;\n font-weight: bold;\n letter-spacing: 0.02em;\n text-decoration: none;\n}\n\n.brand-tile {\n width: 34px;\n height: 34px;\n}\n\n.nav {\n display: flex;\n align-items: center;\n gap: 1.1rem;\n font-size: 0.95rem;\n}\n\n.nav a {\n text-decoration: none;\n opacity: 0.9;\n}\n\n.nav a:hover {\n opacity: 1;\n text-decoration: underline;\n}\n\n.nav .cta {\n background: var(--gold);\n color: var(--ink);\n padding: 0.45rem 0.9rem;\n border-radius: 999px;\n font-weight: bold;\n opacity: 1;\n}\n\n.nav .cta:hover {\n filter: brightness(1.06);\n text-decoration: none;\n}\n\n/* ---------- Hero ---------- */\n.hero {\n text-align: center;\n padding: 4.5rem 1.25rem 4rem;\n background:\n radial-gradient(circle at 20% 20%, rgba(201, 162, 39, 0.18), transparent 45%),\n radial-gradient(circle at 80% 70%, rgba(167, 40, 42, 0.16), transparent 45%),\n var(--felt);\n color: var(--ivory);\n}\n\n.eyebrow {\n text-transform: uppercase;\n letter-spacing: 0.28em;\n font-size: 0.78rem;\n opacity: 0.85;\n margin: 0 0 0.8rem;\n}\n\n.hero h1 {\n font-size: clamp(2.2rem, 6vw, 3.6rem);\n margin: 0 0 0.9rem;\n line-height: 1.1;\n}\n\n.tagline {\n max-width: 34rem;\n margin: 0 auto 1.8rem;\n font-size: 1.08rem;\n opacity: 0.92;\n}\n\n.drop-badge {\n display: inline-block;\n background: rgba(0, 0, 0, 0.28);\n border: 1px solid rgba(247, 243, 232, 0.35);\n border-radius: 14px;\n padding: 0.9rem 1.6rem;\n margin-bottom: 1.9rem;\n}\n\n.drop-label {\n display: block;\n font-size: 0.72rem;\n text-transform: uppercase;\n letter-spacing: 0.22em;\n opacity: 0.75;\n margin-bottom: 0.25rem;\n}\n\n.drop-window {\n font-size: 1.35rem;\n font-weight: bold;\n color: var(--gold);\n}\n\n.btn {\n display: inline-block;\n background: var(--gold);\n color: var(--ink);\n font-weight: bold;\n padding: 0.8rem 1.6rem;\n border-radius: 999px;\n text-decoration: none;\n font-size: 1rem;\n box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);\n}\n\n.btn:hover {\n filter: brightness(1.07);\n}\n\n/* ---------- Sections ---------- */\nsection h2 {\n font-size: 1.9rem;\n margin: 0 0 0.5rem;\n text-align: center;\n}\n\n.section-sub {\n text-align: center;\n color: var(--muted);\n max-width: 34rem;\n margin: 0 auto 2.2rem;\n}\n\n.shops {\n padding: 3.5rem 0;\n background: var(--cream);\n}\n\n.cards {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\n gap: 1.25rem;\n}\n\n.card {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n background: #fff;\n border: 1px solid #e7e0d0;\n border-radius: 14px;\n padding: 1.4rem;\n text-decoration: none;\n color: var(--ink);\n box-shadow: 0 4px 14px rgba(43, 36, 28, 0.06);\n transition: transform 0.15s ease, box-shadow 0.15s ease;\n}\n\n.card:hover {\n transform: translateY(-4px);\n box-shadow: 0 10px 24px rgba(43, 36, 28, 0.14);\n}\n\n.card-tag {\n align-self: flex-start;\n font-size: 0.7rem;\n text-transform: uppercase;\n letter-spacing: 0.12em;\n background: var(--felt);\n color: var(--ivory);\n padding: 0.25rem 0.6rem;\n border-radius: 999px;\n}\n\n.card h3 {\n margin: 0.2rem 0 0;\n font-size: 1.25rem;\n}\n\n.card p {\n margin: 0;\n color: var(--muted);\n font-size: 0.95rem;\n flex: 1;\n}\n\n.card-link {\n font-weight: bold;\n color: var(--red);\n}\n\n.card--blank {\n background: repeating-linear-gradient(\n 45deg,\n #fdfbf5,\n #fdfbf5 10px,\n #f7f2e4 10px,\n #f7f2e4 20px\n );\n border-style: dashed;\n}\n\n/* ---------- Codes ---------- */\n.codes {\n padding: 3.5rem 0;\n background: var(--ivory);\n}\n\n.code-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\n gap: 1.25rem;\n max-width: 46rem;\n margin: 0 auto 1.4rem;\n}\n\n.code {\n background: #fff;\n border: 1px solid #e7e0d0;\n border-radius: 14px;\n padding: 1.3rem 1.5rem;\n text-align: center;\n}\n\n.code-name {\n display: block;\n font-size: 0.85rem;\n color: var(--muted);\n}\n\n.code-value {\n display: block;\n font-size: 1.6rem;\n font-weight: bold;\n color: var(--red);\n letter-spacing: 0.06em;\n margin: 0.3rem 0;\n}\n\n.code-note {\n font-size: 0.8rem;\n color: var(--muted);\n}\n\n.code-hint {\n text-align: center;\n color: var(--muted);\n margin: 0;\n}\n\n.code-hint a {\n color: var(--red);\n font-weight: bold;\n}\n\n/* ---------- Footer ---------- */\nfooter {\n position: relative;\n color: var(--ivory);\n background: var(--felt-dark);\n overflow: hidden;\n}\n\n.fbg {\n position: absolute;\n inset: 0;\n background:\n radial-gradient(circle at 15% 90%, rgba(201, 162, 39, 0.18), transparent 50%),\n radial-gradient(circle at 85% 10%, rgba(167, 40, 42, 0.2), transparent 50%);\n pointer-events: none;\n}\n\n.finner {\n position: relative;\n max-width: 1080px;\n margin: 0 auto;\n padding: 2.5rem 1.25rem;\n text-align: center;\n font-size: 0.95rem;\n}\n\n.footer-logo {\n margin-bottom: 0.9rem;\n}\n\n.footer-mark {\n width: 64px;\n height: 64px;\n}\n\n.fsep {\n margin: 0 0.45rem;\n opacity: 0.5;\n}\n\n.finner a {\n color: var(--gold);\n font-weight: bold;\n}\n\n/* ---------- Responsive ---------- */\n@media (max-width: 560px) {\n .site-header .wrap {\n justify-content: center;\n }\n .nav {\n font-size: 0.85rem;\n gap: 0.8rem;\n }\n .hero {\n padding: 3rem 1rem 2.8rem;\n }\n}\n","children",[],[184],"d6984087-19ea-4903-afca-1335829b4685","main.ts",["D",1787345283289],8,"http","import { staticHTTPServer, readFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { blob } from \"https://esm.town/v/std/blob/main.ts\";\n\nconst BLOB_LOGO = \"mahjong-logo-b64\";\nconst BLOB_LOGOMIME = \"mahjong-logo-mime\";\nconst BLOB_BG = \"mahjong-bg-b64\";\nconst BLOB_BGMIME = \"mahjong-bg-mime\";\n\nfunction corsHeaders(): Record {\n return {\n \"access-control-allow-origin\": \"*\",\n \"access-control-allow-methods\": \"GET, POST, OPTIONS\",\n \"access-control-allow-headers\": \"content-type, x-update-key\",\n };\n}\n\n/**\n * Formats a Date like \"Friday, August 21, 2026\".\n */\nfunction formatLong(d: Date): string {\n return d.toLocaleDateString(\"en-US\", {\n weekday: \"long\",\n year: \"numeric\",\n month: \"long\",\n day: \"numeric\",\n });\n}\n/**\n * Formats a Date like \"Sunday Aug 23\".\n */\nfunction formatShort(d: Date): string {\n return d.toLocaleDateString(\"en-US\", {\n weekday: \"long\",\n month: \"short\",\n day: \"numeric\",\n });\n}\n\n/**\n * Computes the drop window as a Sunday–Saturday range.\n *\n * By default it returns the *upcoming* Sunday–Saturday week (the next drop),\n * which matches a page that announces each week's drop in advance. If today is\n * a Sunday, today is counted as the start of the window.\n *\n * To instead show the *current* week (the Sunday on or before today), change\n * `daysUntilSunday` to `(7 - dow) % 7` → `dow` (i.e. `start` = today minus\n * `dow` days).\n */\nfunction dropWindow(today = new Date()): { start: Date; end: Date } {\n const dow = today.getDay(); // 0 Sun … 6 Sat\n const daysUntilSunday = (7 - dow) % 7; // 0 if today is Sunday\n const start = new Date(today);\n start.setDate(today.getDate() + daysUntilSunday);\n const end = new Date(start);\n end.setDate(start.getDate() + 6); // Saturday\n return { start, end };\n}\n\nexport default staticHTTPServer(import.meta.url, async (req) => {\n const { pathname } = new URL(req.url);\n\n // Serve the branding logo from raw blob storage.\n if (pathname === \"/logo.png\") {\n const res = await blob.get(\"mahjong-logo-raw\");\n const bytes = await res.arrayBuffer();\n return new Response(bytes, {\n headers: {\n ...corsHeaders(),\n \"content-type\": \"image/png\",\n \"cache-control\": \"public, max-age=86400\",\n },\n });\n }\n\n // Serve the branding background from raw blob storage.\n if (pathname === \"/bg.jpg\") {\n const res = await blob.get(\"mahjong-bg-raw\");\n const bytes = await res.arrayBuffer();\n return new Response(bytes, {\n headers: {\n ...corsHeaders(),\n \"content-type\": \"image/jpeg\",\n \"cache-control\": \"public, max-age=86400\",\n },\n });\n }\n\n // Accept raw logo uploads and store into blob storage.\n if (pathname === \"/upload-logo-raw\" && req.method === \"POST\") {\n const key = Deno.env.get(\"UPDATE_KEY\");\n if (!key || req.headers.get(\"X-Update-Key\") !== key) {\n return new Response(\"Unauthorized\", { status: 401, headers: corsHeaders() });\n }\n const bytes = await req.arrayBuffer();\n await blob.set(\"mahjong-logo-raw\", new Uint8Array(bytes));\n return new Response(\"Logo stored!\", { status: 200, headers: corsHeaders() });\n }\n\n // Accept raw background uploads and store into blob storage.\n if (pathname === \"/upload-bg-raw\" && req.method === \"POST\") {\n const key = Deno.env.get(\"UPDATE_KEY\");\n if (!key || req.headers.get(\"X-Update-Key\") !== key) {\n return new Response(\"Unauthorized\", { status: 401, headers: corsHeaders() });\n }\n const bytes = await req.arrayBuffer();\n await blob.set(\"mahjong-bg-raw\", new Uint8Array(bytes));\n return new Response(\"Background stored!\", { status: 200, headers: corsHeaders() });\n }\n\n // /report — serves the drop report, and accepts POST updates from Claude\n if (pathname === \"/report\") {\n if (req.method === \"POST\") {\n const key = Deno.env.get(\"UPDATE_KEY\");\n if (!key || req.headers.get(\"X-Update-Key\") !== key) {\n return new Response(\"Unauthorized\", { status: 401 });\n }\n const html = await req.text();\n await blob.set(\"mahjong-drop-report\", html);\n return new Response(\"Updated!\", { status: 200 });\n }\n\n // Serve the report page\n try {\n const res = await blob.get(\"mahjong-drop-report\");\n const html = await res.text();\n if (!html || html.trim().length === 0) throw new Error(\"Empty blob\");\n return new Response(html, {\n headers: { \"content-type\": \"text/html; charset=utf-8\" },\n });\n } catch {\n return new Response(`\n \n

The Mahjong Drop

@mahjjen • First issue loading shortly...

\n \n `, { headers: { \"content-type\": \"text/html; charset=utf-8\" } });\n }\n }\n\n // Serve static assets (style.css, favicon.svg, …) normally.\n if (pathname !== \"/\" && pathname !== \"/index.html\") return null;\n\n const today = new Date();\n const { start, end } = dropWindow(today);\n const window = `${formatShort(start)} – ${formatShort(end)}, ${end.getFullYear()}`;\n\n let html = await readFile(\"index.html\");\n html = html.replaceAll(\"{{LAST_UPDATED}}\", formatLong(today));\n html = html.replaceAll(\"{{DROP_WINDOW}}\", window);\n\n return new Response(html, {\n headers: { \"content-type\": \"text/html; charset=utf-8\" },\n });\n});\n","mahjjen-drop",[],[194],["D",1787339978625],[],[18],"5fbb9d92-3aba-42f9-bace-ff8cee3a92cf","favicon.svg","6e49acd2-9d88-11f1-8eb0-1607ee4eb77e",6,["D",1787334471652],"\n",[],[206],"3a5d2839-f6a3-419e-83ab-ee83042fc7f3","README.md","6e524b30-9d88-11f1-8eb0-1607ee4eb77e",7,["D",1787334471707],"# Mahj Jen's Weekly Mahjong Drop\n\nA small landing page for Mahj Jen's curated weekly mahjong drop — tiles,\nracks, bags, and accessories from partner shops.\n\n## How it works\n\n- **`main.ts`** — the HTTP server. It computes two dates on every request and\n injects them into the page:\n - **Last updated** — today's date (auto).\n - **Drop window** — the upcoming Sunday–Saturday week (auto), so it always\n shows the next drop without manual edits.\n- **`index.html`** — the page content. Contains two placeholder tokens that the\n server fills in: `{{LAST_UPDATED}}` and `{{DROP_WINDOW}}`.\n- **`style.css`** — styling.\n- **`favicon.svg`** — the browser-tab icon (a mahjong tile).\n\n## Editing the weekly drop\n\nTo feature different shops each week, edit the **Featured This Week** cards in\n`index.html`. The drop window and last-updated dates update themselves.\n\nTo change how the drop window is computed (e.g. show the *current* week instead\nof the *upcoming* one), edit the `dropWindow()` function in `main.ts`.\n",[],[214],["D",1787332239426],{"_11":12,"_137":70},{"_11":12,"_133":70,"_69":70,"_30":68,"_134":135,"_136":24},{"_40":124,"_13":16,"_34":37,"_125":88,"_126":-5,"_127":-5,"_128":-5,"_129":-5,"_130":-5,"_131":14,"_132":12},"ctx",{"_54":-5,"_156":258,"_259":260,"_261":262,"_263":24,"_264":24,"_265":24,"_266":101,"_267":-5,"_268":-7,"_269":-7,"_270":26,"_271":24,"_272":24,"_273":-5,"_274":24,"_275":24,"_276":24,"_277":-5},"ENV",{"_229":230,"_231":232,"_233":16,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245,"_246":247,"_248":249,"_250":251,"_252":253,"_254":255,"_256":257},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History · index.html