189 lines
9.4 KiB
HTML
189 lines
9.4 KiB
HTML
<!doctype html>
|
|
<!--
|
|
The document shell. THIS is the file that ships — `app/app/+html.tsx` is the
|
|
obvious place to put a meta tag and under `web.output: "single"` it is never
|
|
evaluated. All the reasoning lives in `+html.tsx`, which is not served to
|
|
anybody; keep the two in sync and keep this comment short, because every byte
|
|
of it is downloaded by every visitor.
|
|
|
|
Three things must not change. Keep `<div id="root">`. Keep the two
|
|
substitution tokens below exactly where they are. And do not quote a
|
|
substitution token, or a closing head or body tag, anywhere in this comment:
|
|
the CLI fills the template with first-match `String.replace` calls, so a
|
|
comment that names one swallows it — which the first draft of this file did,
|
|
putting the literal title token in the tab and the bundle script in the middle
|
|
of this paragraph.
|
|
-->
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
|
|
|
<title>Pull Up — Pickup sports at UF</title>
|
|
<meta
|
|
name="description"
|
|
content="Post a pickup game at UF, or ask to join one. Fifteen sports on the courts and fields you already walk past. Free, nothing to install, and the host approves everyone who plays."
|
|
/>
|
|
<link rel="canonical" href="https://pullup.onetouch.studio/" />
|
|
<meta name="robots" content="index, follow, max-image-preview:large" />
|
|
|
|
<!-- Open Graph. iMessage, WhatsApp, Slack, Discord, Instagram DMs and
|
|
Facebook all read these; Twitter falls back to them for anything its
|
|
own namespace does not define. Absolute URLs are not optional here —
|
|
a relative og:image is dropped by most of them. -->
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:site_name" content="Pull Up" />
|
|
<meta property="og:title" content="Pull Up — Pickup sports at UF" />
|
|
<meta
|
|
property="og:description"
|
|
content="Post a pickup game at UF, or ask to join one. Fifteen sports on the courts and fields you already walk past. Free, nothing to install, and the host approves everyone who plays."
|
|
/>
|
|
<meta property="og:url" content="https://pullup.onetouch.studio/" />
|
|
<meta property="og:locale" content="en_US" />
|
|
<meta property="og:image" content="https://pullup.onetouch.studio/og.png" />
|
|
<meta property="og:image:type" content="image/png" />
|
|
<!-- Declared dimensions let a client lay out the card before the image has
|
|
downloaded, which is the difference between a preview that appears with
|
|
the message and one that pops in a second later. -->
|
|
<meta property="og:image:width" content="1200" />
|
|
<meta property="og:image:height" content="630" />
|
|
<!-- Alt text describes ONE SPECIFIC PNG and nothing renders it beside that
|
|
PNG, so it is the tag here that rots without anyone noticing. It had
|
|
been promising the line "There is a game on tonight." — which is real
|
|
copy, but it belongs to the 1080x1920 story and the brand deck, and has
|
|
never appeared on this card. The card is drawn by og() in
|
|
design/brand/lib/social.mjs; open app/public/og.png before editing. -->
|
|
<meta
|
|
property="og:image:alt"
|
|
content="The Pull Up link card: the words PULL UP. set huge in white on near-black, over the line Post a game. Or ask to join one. and the address pullup.onetouch.studio, beside a sample of the feed listing a pickleball, a basketball and a climbing game with the court and the time each one starts."
|
|
/>
|
|
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content="Pull Up — Pickup sports at UF" />
|
|
<meta
|
|
name="twitter:description"
|
|
content="Post a pickup game at UF, or ask to join one. Fifteen sports on the courts and fields you already walk past. Free, nothing to install, and the host approves everyone."
|
|
/>
|
|
<meta name="twitter:image" content="https://pullup.onetouch.studio/og.png" />
|
|
<meta
|
|
name="twitter:image:alt"
|
|
content="The Pull Up link card: the words PULL UP. set huge in white on near-black, over the line Post a game. Or ask to join one. and the address pullup.onetouch.studio, beside a sample of the feed listing a pickleball, a basketball and a climbing game with the court and the time each one starts."
|
|
/>
|
|
|
|
<!-- Icons. Every one of these is a fixed path in `public/`, because Metro
|
|
content-hashes anything it bundles and a manifest cannot point at a
|
|
name that changes each build. Placed by design/web-assets.mjs from the
|
|
cuts in design/brand/. The .ico goes first with `sizes="any"`: that is
|
|
the ordering that makes a browser which understands SVG take the SVG
|
|
and one which does not fall back cleanly. -->
|
|
<link rel="icon" href="/favicon.ico" sizes="any" />
|
|
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png" />
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16.png" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
|
|
<link rel="manifest" href="/site.webmanifest" />
|
|
|
|
<meta name="theme-color" content="#0C0C0E" />
|
|
<meta name="color-scheme" content="dark" />
|
|
|
|
<!-- Add-to-home-screen. This is not decoration: iOS will not deliver a web
|
|
push at all unless the site has been added to the home screen, so the
|
|
standalone metadata is load-bearing for notifications, not just for
|
|
looks. `black` rather than `black-translucent` because the viewport is
|
|
not `viewport-fit=cover` — translucent without cover leaves a white
|
|
band above a near-black app. -->
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-title" content="Pull Up" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
|
|
<meta name="application-name" content="Pull Up" />
|
|
|
|
<!-- Archivo, the app's face. `lib/theme.ts` asks every screen for it and
|
|
until this line shipped nothing ever loaded it, so the whole product
|
|
rendered in the system UI font. It belongs in the document rather than
|
|
in the JS bundle: a font requested by a chunk that has not parsed yet
|
|
starts downloading a second too late. -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@75..125,400..900&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
|
|
<!-- The `react-native-web` recommended style reset: https://necolas.github.io/react-native-web/docs/setup/#root-element -->
|
|
<style id="expo-reset">
|
|
/* These styles make the body full-height */
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
}
|
|
/* These styles disable body scrolling if you are using <ScrollView> */
|
|
body {
|
|
overflow: hidden;
|
|
}
|
|
/* These styles make the root element full-height */
|
|
#root {
|
|
display: flex;
|
|
height: 100%;
|
|
flex: 1;
|
|
}
|
|
</style>
|
|
|
|
<style id="pullup-base">
|
|
html, body { background: #0C0C0E; color-scheme: dark; }
|
|
body { font-family: Archivo, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
|
|
|
|
/* One soft light source behind everything so large dark areas have
|
|
depth instead of reading as a flat void. Fixed, so it does not
|
|
travel with the scroll. */
|
|
body::before {
|
|
content: "";
|
|
position: fixed;
|
|
inset: 0;
|
|
pointer-events: none;
|
|
/* Barely there. Enough that a large dark area is not flat,
|
|
not enough to read as a coloured glow. */
|
|
background:
|
|
radial-gradient(60rem 40rem at 82% -10%, rgba(143,227,136,0.045), transparent 60%),
|
|
radial-gradient(50rem 36rem at 4% 106%, rgba(255,255,255,0.02), transparent 58%);
|
|
z-index: 0;
|
|
}
|
|
#root { position: relative; z-index: 1; }
|
|
|
|
::selection { background: rgba(143,227,136,0.25); }
|
|
|
|
/* The default scrollbar on a dark page is a bright grey slab. */
|
|
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.16) transparent; }
|
|
*::-webkit-scrollbar { width: 10px; height: 10px; }
|
|
*::-webkit-scrollbar-thumb {
|
|
background: rgba(255,255,255,0.14);
|
|
border-radius: 99px;
|
|
border: 3px solid transparent;
|
|
background-clip: content-box;
|
|
}
|
|
*::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.24); background-clip: content-box; }
|
|
*::-webkit-scrollbar-track { background: transparent; }
|
|
|
|
input, textarea { font-family: inherit; }
|
|
/* Autofill repaints Chrome inputs white, which looks broken here. */
|
|
input:-webkit-autofill,
|
|
input:-webkit-autofill:hover,
|
|
input:-webkit-autofill:focus {
|
|
-webkit-text-fill-color: #EDEDEF;
|
|
-webkit-box-shadow: 0 0 0 1000px #141417 inset;
|
|
transition: background-color 9999s ease-in-out 0s;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<!-- Use static rendering with Expo Router to support running without JavaScript. -->
|
|
<noscript>
|
|
You need to enable JavaScript to run this app.
|
|
</noscript>
|
|
<!-- The root element for your Expo app. -->
|
|
<div id="root"></div>
|
|
<script src="/_expo/static/js/web/entry-7a9a8c35c7cbe7032c4ca1da9ec6b37c.js" defer></script>
|
|
</body>
|
|
</html>
|