Preserve hosted website UX inside Archipelago, add isolated Business and owner-authorized native wallet setup, and include deployment handoff. Based on main with native signer import already accepted.
13 lines
7.0 KiB
HTML
13 lines
7.0 KiB
HTML
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="theme-color" content="#0a0a0a"><title>LocalPub Madeira — Just Works</title><link rel="icon" href="/assets/portal.svg"><link rel="stylesheet" href="./assets/tokens.css?v=1"><link rel="stylesheet" href="./assets/ds.css?v=1">
|
||
<script>(function(){try{var t=localStorage.getItem("jw-theme");if(t==="light"||t==="dark")document.documentElement.setAttribute("data-theme",t)}catch(e){}})()</script>
|
||
<style>*{box-sizing:border-box}html{background:#0a0a0a}
|
||
.site-nav .jw-portal-frame{fill:#fafafa}
|
||
.site-nav .jw-portal-head{stop-color:rgba(250,250,250,.6)}
|
||
.site-nav .jw-mark-portal{filter:none}
|
||
.site-nav .jw-app-icon{background:rgba(10,10,10,.72);--jw-app-icon-rim-bright:rgba(255,255,255,.85);--jw-app-icon-rim-fade:rgba(10,10,10,.04)}
|
||
#themeToggle{display:none}.site-nav .theme-toggle{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28)}
|
||
.site-nav .theme-toggle button{color:rgba(255,255,255,.68)}
|
||
.site-nav .theme-toggle button:hover{color:#fafafa}
|
||
.site-nav .theme-toggle button[aria-pressed="true"]{background:rgba(255,255,255,.2);color:#fafafa;box-shadow:none}
|
||
.site-nav .nav-actions{display:flex;align-items:center;gap:16px}body{margin:0;color:#fafafa;background:#0a0a0a;font-family:var(--jw-font-sans,"Geist Variable",Inter,system-ui,sans-serif)}.site-nav{position:absolute;inset:0 0 auto;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:22px clamp(20px,6vw,72px);color:#fafafa}.wordmark{display:flex;align-items:center;gap:10px;font-weight:900}.owned{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7)}.hero{position:relative;min-height:78svh;display:flex;align-items:flex-end;padding:130px clamp(20px,8vw,110px) clamp(56px,8vw,100px);overflow:hidden;background:#161815}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.56) 48%,rgba(0,0,0,.14)),linear-gradient(0deg,rgba(0,0,0,.72),transparent 55%),url('/assets/examples/localpub-venue.webp') center/cover;transform:scale(1.01)}.hero-copy{position:relative;z-index:1;max-width:820px}.tag{display:inline-flex;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:8px 12px;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.hero h1{font-family:var(--jw-font-display,"Syne Variable",system-ui,sans-serif);font-size:clamp(58px,11vw,142px);font-weight:650;line-height:.78;letter-spacing:-.07em;margin:28px 0}.hero p{max-width:620px;color:rgba(255,255,255,.74);font-size:clamp(17px,2vw,22px);line-height:1.5}.content{background:var(--jw-bg,#fafafa);color:var(--jw-text-primary,#0a0a0a);padding:clamp(60px,10vw,130px) clamp(20px,8vw,110px)}.intro{max-width:1220px;margin:auto;display:grid;grid-template-columns:.55fr 1fr;gap:clamp(28px,8vw,120px);padding-bottom:clamp(55px,8vw,90px)}.section-label{color:var(--jw-accent,#f4511e);font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}.intro h2{font-family:var(--jw-font-display,"Syne Variable",system-ui,sans-serif);font-size:clamp(38px,6vw,72px);font-weight:650;line-height:.96;letter-spacing:-.05em;margin:0}.intro p{color:var(--jw-text-body,#454545);font-size:18px;line-height:1.7;margin:22px 0 0}.napplet-wrap{max-width:1220px;margin:auto;border-top:1px solid var(--jw-line,rgba(0,0,0,.1));padding-top:28px}.napplet-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.napplet-head h3{font-family:var(--jw-font-display,"Syne Variable",system-ui,sans-serif);font-size:clamp(28px,4vw,48px);letter-spacing:-.04em;margin:5px 0}.state{border:1px solid var(--jw-line-strong,rgba(0,0,0,.2));border-radius:999px;padding:8px 12px;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.napplet{overflow:hidden;border:1px solid var(--jw-line,rgba(0,0,0,.1));border-radius:24px;background:#111315;box-shadow:var(--jw-shadow-lg,0 18px 54px rgba(0,0,0,.08))}.napplet iframe{display:block;width:100%;height:640px;border:0}.off{padding:54px;text-align:center;color:var(--jw-text-muted,#737373);background:var(--jw-surface-sunken,#f2f4f3)}footer{display:flex;justify-content:space-between;gap:24px;padding:30px clamp(20px,8vw,110px);background:#0a0a0a;color:rgba(250,250,250,.58);font-size:12px}footer strong{color:#fafafa}@media(max-width:720px){.site-nav{padding:18px}.owned{display:none}.hero{min-height:68svh;padding-inline:20px}.intro{grid-template-columns:1fr}.napplet-head{align-items:flex-start;flex-direction:column}.napplet iframe{height:680px}.content{padding-inline:14px}footer{flex-direction:column}}</style></head><body><nav class="site-nav"><div class="wordmark"><span class="brand-logo" data-logo="icon"></span><span>Just Works</span></div><div class="nav-actions"><span class="owned">Nostr-owned business page</span><div id="themeToggle"></div></div></nav><section class="hero"><div class="hero-copy"><span class="tag">Madeira · Local venue</span><h1>LocalPub<br>Madeira</h1><p>Poncha, people, and a page the business owns. Order from your table without waiting for the waiter.</p></div></section><main class="content"><section class="intro"><span class="section-label">The local</span><div><h2>Good drinks.<br>No platform lock-in.</h2><p>The menu and story remain part of the merchant’s sovereign page. Interactive services arrive as isolated napplets and disappear cleanly when disabled.</p></div></section><section class="napplet-wrap"><header class="napplet-head"><div><span class="section-label">Live service</span><h3>Order to Table</h3></div><span class="state">Sandboxed NIP-5D napplet</span></header><div id="mount" class="napplet off">Loading merchant configuration…</div></section></main><footer><strong>LocalPub Madeira</strong><span>Built with Just Works · Payments optional · Ownership isn’t</span></footer><script type="module">import{mountThemeToggle}from'./assets/ds/theme.js';import{mountLogo}from'./assets/ds/logo.js';mountThemeToggle(document.querySelector('#themeToggle'));for(const host of document.querySelectorAll('[data-logo]'))mountLogo(host,{icon:host.dataset.logo==='icon'});const prefix=location.pathname.split('/').slice(0,-1).join('/');const token=new URLSearchParams(location.search).get('table');async function boot(){let chosen=token;if(!chosen){const d=await fetch(prefix+'/api/dashboard').then(r=>r.json());chosen=(d.tables.find(t=>t.table_number===21)||d.tables[0]).token;history.replaceState(null,'',location.pathname+'?table='+encodeURIComponent(chosen))}const c=await fetch(prefix+'/api/config').then(r=>r.json());const mount=document.querySelector('#mount');if(!c.module_enabled){mount.textContent='Order to Table is currently disabled by the merchant.';return}mount.className='napplet';mount.innerHTML=`<iframe title="Order to Table napplet shell" src="${prefix}/embed?table=${encodeURIComponent(chosen)}"></iframe>`}boot().catch(()=>document.querySelector('#mount').textContent='Napplet unavailable — the nsite itself still works.')</script></body></html>
|