Claude
8918951482
Captain Bob, 2026-11-07: build the .com from the StarshipOS.com canvas.
canvas/ holds the artboards as drawn; build.py makes Main, Inquiries and
TryIt as {{html}} pages (the wiki's links and domains, the images as
attachments, the real console in Try it, the forms by e-mail); install.sh
puts them on the wiki and checks a guest's view. Installed on
starshipos-f18.com: every page and image reads 200 as a guest, and renders
without a macro error.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GE3SDvQn5EoxdGufk84zz2
119 lines
7.3 KiB
HTML
119 lines
7.3 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>StarshipOS — Inquiries</title>
|
|
<script src="./support.js"></script>
|
|
</head>
|
|
<body>
|
|
<x-dc>
|
|
<helmet>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Exo+2:wght@600;700&display=swap" rel="stylesheet">
|
|
<style>
|
|
body{margin:0;background:#0A1222}
|
|
a{color:#F5891F}a:hover{color:#FFB061}
|
|
</style>
|
|
</helmet>
|
|
<div style="background: #0A1222; color: #EEF2F7; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 16px; line-height: 1.6; min-height: 100vh">
|
|
|
|
<header style="border-bottom: 1px solid #22324D">
|
|
<nav aria-label="Main" style="max-width: 1120px; margin: 0 auto; padding: 20px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px">
|
|
<a href="Main.dc.html" style="font-family: 'Exo 2', sans-serif; font-weight: 700; font-size: 22px; color: #EEF2F7; text-decoration: none; letter-spacing: 0.02em">starship<span style="color: {{accent}}">OS</span></a>
|
|
<div style="display: flex; flex-wrap: wrap; gap: 24px; font-size: 14px">
|
|
<a href="Main.dc.html" style="color: #C8D1DE; text-decoration: none">Home</a>
|
|
<a href="Inquiries.dc.html" aria-current="page" style="color: #EEF2F7; text-decoration: none; border-bottom: 2px solid {{accent}}">Inquiries</a>
|
|
<a href="https://starshipos.org" style="color: {{accent}}; text-decoration: none">Contributors →</a>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
|
|
<section style="max-width: 1120px; margin: 0 auto; padding: 80px 24px 32px">
|
|
<p style="margin: 0 0 12px; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: {{accent}}">Inquiries</p>
|
|
<h1 style="margin: 0 0 16px; font-family: 'Exo 2', sans-serif; font-size: clamp(36px, 5vw, 56px); line-height: 1.1">Talk to the bridge.</h1>
|
|
<p style="margin: 0; max-width: 640px; font-size: 18px; color: #C8D1DE">Licensing, research collaboration, press or plain curiosity — every message is read by a human. Want to contribute code? Head to <a href="https://starshipos.org">starshipos.org</a>.</p>
|
|
</section>
|
|
|
|
<section style="max-width: 1120px; margin: 0 auto; padding: 32px 24px 96px; display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start">
|
|
|
|
<form aria-label="Inquiry form" style="flex: 999 1 520px; min-width: 0; background: #111C30; border: 1px solid #22324D; border-radius: 6px; padding: 32px; display: flex; flex-direction: column; gap: 20px">
|
|
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px">
|
|
<div style="display: flex; flex-direction: column; gap: 8px">
|
|
<label for="q-name" style="font-size: 14px; color: #C8D1DE">Name</label>
|
|
<input id="q-name" type="text" autocomplete="name" style="min-height: 48px; padding: 0 14px; background: #0A1222; border: 1px solid #34486A; border-radius: 4px; color: #EEF2F7; font-family: inherit; font-size: 15px">
|
|
</div>
|
|
<div style="display: flex; flex-direction: column; gap: 8px">
|
|
<label for="q-email" style="font-size: 14px; color: #C8D1DE">Email</label>
|
|
<input id="q-email" type="email" autocomplete="email" style="min-height: 48px; padding: 0 14px; background: #0A1222; border: 1px solid #34486A; border-radius: 4px; color: #EEF2F7; font-family: inherit; font-size: 15px">
|
|
</div>
|
|
</div>
|
|
<div style="display: flex; flex-direction: column; gap: 8px">
|
|
<label for="q-org" style="font-size: 14px; color: #C8D1DE">Organization <span style="color: #A3AEC2">(optional)</span></label>
|
|
<input id="q-org" type="text" autocomplete="organization" style="min-height: 48px; padding: 0 14px; background: #0A1222; border: 1px solid #34486A; border-radius: 4px; color: #EEF2F7; font-family: inherit; font-size: 15px">
|
|
</div>
|
|
<div style="display: flex; flex-direction: column; gap: 8px">
|
|
<label for="q-topic" style="font-size: 14px; color: #C8D1DE">Topic</label>
|
|
<select id="q-topic" style="min-height: 48px; padding: 0 14px; background: #0A1222; border: 1px solid #34486A; border-radius: 4px; color: #EEF2F7; font-family: inherit; font-size: 15px">
|
|
<option>General question</option>
|
|
<option>Licensing</option>
|
|
<option>Research collaboration</option>
|
|
<option>Hardware / FPGA</option>
|
|
<option>Press & media</option>
|
|
</select>
|
|
</div>
|
|
<div style="display: flex; flex-direction: column; gap: 8px">
|
|
<label for="q-msg" style="font-size: 14px; color: #C8D1DE">Message</label>
|
|
<textarea id="q-msg" rows="7" style="padding: 12px 14px; background: #0A1222; border: 1px solid #34486A; border-radius: 4px; color: #EEF2F7; font-family: inherit; font-size: 15px; resize: vertical"></textarea>
|
|
</div>
|
|
<div style="display: flex; align-items: flex-start; gap: 12px">
|
|
<input id="q-list" type="checkbox" style="width: 20px; height: 20px; margin: 3px 0 0; accent-color: {{accent}}">
|
|
<label for="q-list" style="font-size: 14px; color: #C8D1DE">Also add me to launch announcements (low volume, unsubscribe anytime).</label>
|
|
</div>
|
|
<div style="display: flex; flex-wrap: wrap; align-items: center; gap: 16px">
|
|
<button type="button" style="min-height: 48px; padding: 0 28px; background: {{accent}}; color: #0A1222; border: 0; border-radius: 4px; font-family: inherit; font-weight: 700; font-size: 15px; cursor: pointer">Send inquiry</button>
|
|
<span style="font-size: 13px; color: #A3AEC2">Replies usually within a few days.</span>
|
|
</div>
|
|
</form>
|
|
|
|
<aside aria-label="Direct addresses" style="flex: 1 1 300px; display: flex; flex-direction: column; gap: 24px">
|
|
<h2 style="margin: 0; font-family: 'Exo 2', sans-serif; font-size: 24px">Or write directly</h2>
|
|
<div style="border-top: 1px solid #22324D; padding-top: 16px">
|
|
<div style="font-size: 13px; color: #A3AEC2">General</div>
|
|
<a href="mailto:info@starshipos.com" style="font-size: 16px">info@starshipos.com</a>
|
|
</div>
|
|
<div style="border-top: 1px solid #22324D; padding-top: 16px">
|
|
<div style="font-size: 13px; color: #A3AEC2">Licensing & partnerships</div>
|
|
<a href="mailto:licensing@starshipos.com" style="font-size: 16px">licensing@starshipos.com</a>
|
|
</div>
|
|
<div style="border-top: 1px solid #22324D; padding-top: 16px">
|
|
<div style="font-size: 13px; color: #A3AEC2">Press & media</div>
|
|
<a href="mailto:press@starshipos.com" style="font-size: 16px">press@starshipos.com</a>
|
|
</div>
|
|
<div style="border-top: 1px solid #22324D; padding-top: 16px">
|
|
<div style="font-size: 13px; color: #A3AEC2">Security reports</div>
|
|
<a href="mailto:security@starshipos.org" style="font-size: 16px">security@starshipos.org</a>
|
|
</div>
|
|
<p style="margin: 0; padding-top: 16px; border-top: 1px solid #22324D; font-size: 13px; color: #A3AEC2">StarshipOS is developed in Ashland, Ohio.</p>
|
|
</aside>
|
|
|
|
</section>
|
|
|
|
<footer style="border-top: 1px solid #22324D">
|
|
<div style="max-width: 1120px; margin: 0 auto; padding: 32px 24px; display: flex; flex-wrap: wrap; gap: 16px 32px; justify-content: space-between; font-size: 13px; color: #A3AEC2">
|
|
<span>© 2026 Robert Allan James · A Starship Foundation project (in formation)</span>
|
|
<span style="display: flex; flex-wrap: wrap; gap: 24px"><a href="Main.dc.html" style="color: #C8D1DE">Home</a><a href="https://starshipos.org" style="color: #C8D1DE">starshipos.org</a></span>
|
|
</div>
|
|
</footer>
|
|
|
|
</div>
|
|
</x-dc>
|
|
<script type="text/x-dc" data-dc-script data-props='{"accent":{"editor":"color","default":"#F5891F","options":["#F5891F","#5FD3C4","#8FB8FF"]},"$preview":{"width":1280,"height":1700}}'>
|
|
class Component extends DCLogic {
|
|
renderVals() {
|
|
return { accent: this.props.accent ?? '#F5891F' };
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|