Landing on phones: play button at the strip's lower-left with a short label; nav keeps Get started + Open my board

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-19 19:21:51 -05:00
parent 7df6ed66cd
commit cdded9d4ed
4 changed files with 5 additions and 5 deletions
+1 -1
View File
@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width,initial-scale=1">
<title>Admin · PolHunter</title> <title>Admin · PolHunter</title>
<meta name="robots" content="noindex,nofollow"> <meta name="robots" content="noindex,nofollow">
<link rel="stylesheet" href="/style.css?v=6"> <link rel="stylesheet" href="/style.css?v=7">
<style> <style>
label{display:block;font-size:12px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase;margin:10px 0 4px} label{display:block;font-size:12px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase;margin:10px 0 4px}
input,textarea,select{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--edge);background:rgba(0,0,0,.35);color:var(--ink);font:14px var(--font)} input,textarea,select{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--edge);background:rgba(0,0,0,.35);color:var(--ink);font:14px var(--font)}
+1 -1
View File
@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width,initial-scale=1">
<title>Your board · PolHunter</title> <title>Your board · PolHunter</title>
<meta name="robots" content="noindex"> <meta name="robots" content="noindex">
<link rel="stylesheet" href="/style.css?v=6"> <link rel="stylesheet" href="/style.css?v=7">
</head> </head>
<body> <body>
<div class="wrap"> <div class="wrap">
+2 -2
View File
@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width,initial-scale=1">
<title>PolHunter</title> <title>PolHunter</title>
<meta name="description" content="Missions across the network. Visit a site, find the thing, get a drip of POL to your wallet."> <meta name="description" content="Missions across the network. Visit a site, find the thing, get a drip of POL to your wallet.">
<link rel="stylesheet" href="/style.css?v=6"> <link rel="stylesheet" href="/style.css?v=7">
</head> </head>
<body> <body>
<div class="wrap"> <div class="wrap">
@@ -25,7 +25,7 @@
<source type="image/webp" srcset="/img/hero.webp"> <source type="image/webp" srcset="/img/hero.webp">
<img src="/img/hero.jpg" alt="" fetchpriority="high" decoding="async"> <img src="/img/hero.jpg" alt="" fetchpriority="high" decoding="async">
</picture> </picture>
<button class="play" id="play" type="button" aria-label="Watch the 30-second teaser"><span class="tri"></span>Watch the 30-second teaser</button> <button class="play" id="play" type="button" aria-label="Watch the 30-second teaser"><span class="tri"></span>Watch the<span class="lbl-long">&nbsp;30-second</span> teaser</button>
<div class="hero-copy"> <div class="hero-copy">
<span class="pill"><i></i> Paying in POL on Polygon</span> <span class="pill"><i></i> Paying in POL on Polygon</span>
<h1>Visit it. Find it.<br><b>Get paid in POL.</b></h1> <h1>Visit it. Find it.<br><b>Get paid in POL.</b></h1>
+1 -1
View File
@@ -80,6 +80,6 @@ a{color:var(--pol-hi);text-decoration:none} a:hover{color:var(--gold-hi)}
.msg{margin-top:10px;font-size:14px} .msg.ok{color:var(--ok)} .msg.bad{color:var(--bad)} .msg{margin-top:10px;font-size:14px} .msg.ok{color:var(--ok)} .msg.bad{color:var(--bad)}
.foot{padding:40px 0 30px;color:var(--dim);font-size:12.5px;line-height:1.7;border-top:1px solid var(--edge);margin-top:30px} .foot{padding:40px 0 30px;color:var(--dim);font-size:12.5px;line-height:1.7;border-top:1px solid var(--edge);margin-top:30px}
.adslot{min-height:90px;display:flex;align-items:center;justify-content:center;margin:26px 0;color:var(--dim);font-size:12px} .adslot{min-height:90px;display:flex;align-items:center;justify-content:center;margin:26px 0;color:var(--dim);font-size:12px}
@media (max-width:820px){.hero{min-height:0;margin:0 -20px 6px;border-top:0;display:block}.hero-art{position:relative;inset:auto;display:block;height:270px}.hero-art img{object-position:60% 50%}.hero::before{inset:auto 0 auto 0;top:150px;height:121px;background:linear-gradient(180deg,transparent,var(--bg))}.hero-copy{padding:6px 20px 32px}.hero p{font-size:16.5px}.play{right:auto;bottom:auto;left:50%;top:135px;transform:translate(-50%,-50%)}.play:hover{transform:translate(-50%,-50%)}.adslot{overflow-x:auto;justify-content:flex-start}.row{grid-template-columns:1fr auto;row-gap:6px}.row .when{grid-column:1/-1;font-size:13px;color:var(--pol-hi)}.adslot{margin:18px -4px}} @media (max-width:820px){.hero{min-height:0;margin:0 -20px 6px;border-top:0;display:block}.hero-art{position:relative;inset:auto;display:block;height:270px}.hero-art img{object-position:60% 50%}.hero::before{inset:auto 0 auto 0;top:150px;height:121px;background:linear-gradient(180deg,transparent,var(--bg))}.hero-copy{padding:6px 20px 32px}.hero p{font-size:16.5px}.play{right:auto;left:14px;bottom:auto;top:214px;padding:9px 16px 9px 10px;font-size:13px;white-space:nowrap}.play .tri{width:28px;height:28px}.play .tri::after{left:10px;top:7px}.play .lbl-long{display:none}.nav a:nth-child(2),.nav a:nth-child(3){display:none}.adslot{overflow-x:auto;justify-content:flex-start}.row{grid-template-columns:1fr auto;row-gap:6px}.row .when{grid-column:1/-1;font-size:13px;color:var(--pol-hi)}.adslot{margin:18px -4px}}
/* every drip row carries its blockchain verify link; on phones it sits on its own line (Marty, 2026-09-19) */ /* every drip row carries its blockchain verify link; on phones it sits on its own line (Marty, 2026-09-19) */
.row a.when{color:var(--pol-hi)} .row a.when:hover{color:var(--gold-hi)} .row a.when{color:var(--pol-hi)} .row a.when:hover{color:var(--gold-hi)}