mirror of
https://github.com/sst/opencode.git
synced 2025-12-23 10:11:41 +00:00
fix: website hero copy
This commit is contained in:
parent
2555dba188
commit
408cdaf5e0
2 changed files with 52 additions and 25 deletions
|
|
@ -338,6 +338,11 @@ body {
|
|||
}
|
||||
}
|
||||
|
||||
[data-slot="installation-instructions"] {
|
||||
color: var(--color-text-strong);
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
[data-slot="installation"] {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
|
|
@ -348,6 +353,11 @@ body {
|
|||
}
|
||||
}
|
||||
|
||||
[data-slot="installation-options"] {
|
||||
font-size: 13px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
[data-component="tabs"] {
|
||||
[data-slot="tablist"] {
|
||||
display: flex;
|
||||
|
|
@ -480,10 +490,10 @@ body {
|
|||
}
|
||||
|
||||
h1 {
|
||||
font-size: 28px;
|
||||
font-size: 38px;
|
||||
color: var(--color-text-strong);
|
||||
font-weight: 500;
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: 8px;
|
||||
|
||||
@media (max-width: 60rem) {
|
||||
font-size: 22px;
|
||||
|
|
@ -492,7 +502,7 @@ body {
|
|||
|
||||
p {
|
||||
color: var(--color-text);
|
||||
margin-bottom: 24px;
|
||||
margin-bottom: 40px;
|
||||
max-width: 82%;
|
||||
|
||||
@media (max-width: 50rem) {
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ export default function Home() {
|
|||
return (
|
||||
<main data-page="opencode">
|
||||
{/*<HttpHeader name="Cache-Control" value="public, max-age=1, s-maxage=3600, stale-while-revalidate=86400" />*/}
|
||||
<Title>OpenCode | The AI coding agent built for the terminal</Title>
|
||||
<Title>OpenCode | The open source AI coding agent</Title>
|
||||
<Link rel="canonical" href={config.baseUrl} />
|
||||
<Meta property="og:image" content="/social-share.png" />
|
||||
<Meta name="twitter:image" content="/social-share.png" />
|
||||
|
|
@ -53,26 +53,33 @@ export default function Home() {
|
|||
<div data-component="content">
|
||||
<section data-component="hero">
|
||||
<div data-slot="hero-copy">
|
||||
<a data-slot="releases" href={release()?.url ?? `${config.github.repoUrl}/releases`} target="_blank">
|
||||
<a data-slot="releases"
|
||||
href={release()?.url ?? `${config.github.repoUrl}/releases`}
|
||||
target="_blank">
|
||||
What’s new in {release()?.name ?? "the latest release"}
|
||||
</a>
|
||||
<h1>The AI coding agent built for the terminal</h1>
|
||||
<h1>The open source coding agent</h1>
|
||||
<p>
|
||||
OpenCode is fully open source, giving you control and freedom to use any provider, any model, and any
|
||||
editor.
|
||||
OpenCode includes free models or connect from any provider
|
||||
to <br />
|
||||
use other models, including Claude, GPT, Gemini and more.
|
||||
</p>
|
||||
<a href="/docs">
|
||||
<span>Read docs </span>
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M6.5 12L17 12M13 16.5L17.5 12L13 7.5"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="square"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
{/*<a href="/docs">*/}
|
||||
{/* <span>Read docs </span>*/}
|
||||
{/* <svg width="24" height="24" viewBox="0 0 24 24" fill="none"*/}
|
||||
{/* xmlns="http://www.w3.org/2000/svg">*/}
|
||||
{/* <path*/}
|
||||
{/* d="M6.5 12L17 12M13 16.5L17.5 12L13 7.5"*/}
|
||||
{/* stroke="currentColor"*/}
|
||||
{/* stroke-width="1.5"*/}
|
||||
{/* stroke-linecap="square"*/}
|
||||
{/* />*/}
|
||||
{/* </svg>*/}
|
||||
{/*</a>*/}
|
||||
</div>
|
||||
<p data-slot="installation-instructions">
|
||||
Install and use. No account, no email, and no credit card.
|
||||
</p>
|
||||
<div data-slot="installation">
|
||||
<Tabs
|
||||
as="section"
|
||||
|
|
@ -102,7 +109,8 @@ export default function Home() {
|
|||
</Tabs.List>
|
||||
<div data-slot="panels">
|
||||
<Tabs.Content as="pre" data-slot="panel" value="curl">
|
||||
<button data-copy data-slot="command" onClick={handleCopyClick}>
|
||||
<button data-copy data-slot="command"
|
||||
onClick={handleCopyClick}>
|
||||
<span data-slot="command-script">
|
||||
<span>curl -fsSL </span>
|
||||
<span data-slot="protocol">https://</span>
|
||||
|
|
@ -113,7 +121,8 @@ export default function Home() {
|
|||
</button>
|
||||
</Tabs.Content>
|
||||
<Tabs.Content as="pre" data-slot="panel" value="npm">
|
||||
<button data-copy data-slot="command" onClick={handleCopyClick}>
|
||||
<button data-copy data-slot="command"
|
||||
onClick={handleCopyClick}>
|
||||
<span>
|
||||
<span data-slot="protocol">npm i -g </span>
|
||||
<span data-slot="highlight">opencode-ai</span>
|
||||
|
|
@ -122,7 +131,8 @@ export default function Home() {
|
|||
</button>
|
||||
</Tabs.Content>
|
||||
<Tabs.Content as="pre" data-slot="panel" value="bun">
|
||||
<button data-copy data-slot="command" onClick={handleCopyClick}>
|
||||
<button data-copy data-slot="command"
|
||||
onClick={handleCopyClick}>
|
||||
<span>
|
||||
<span data-slot="protocol">bun add -g </span>
|
||||
<span data-slot="highlight">opencode-ai</span>
|
||||
|
|
@ -131,7 +141,8 @@ export default function Home() {
|
|||
</button>
|
||||
</Tabs.Content>
|
||||
<Tabs.Content as="pre" data-slot="panel" value="brew">
|
||||
<button data-copy data-slot="command" onClick={handleCopyClick}>
|
||||
<button data-copy data-slot="command"
|
||||
onClick={handleCopyClick}>
|
||||
<span>
|
||||
<span data-slot="protocol">brew install </span>
|
||||
<span data-slot="highlight">opencode</span>
|
||||
|
|
@ -140,7 +151,8 @@ export default function Home() {
|
|||
</button>
|
||||
</Tabs.Content>
|
||||
<Tabs.Content as="pre" data-slot="panel" value="paru">
|
||||
<button data-copy data-slot="command" onClick={handleCopyClick}>
|
||||
<button data-copy data-slot="command"
|
||||
onClick={handleCopyClick}>
|
||||
<span>
|
||||
<span data-slot="protocol">paru -S </span>
|
||||
<span data-slot="highlight">opencode</span>
|
||||
|
|
@ -151,10 +163,15 @@ export default function Home() {
|
|||
</div>
|
||||
</Tabs>
|
||||
</div>
|
||||
<p data-slot="installation-options">
|
||||
Available in terminal, web, and desktop (coming soon).<br />
|
||||
Extensions for VS Code, Cursor, Windsurf, and more.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section data-component="video">
|
||||
<video src={video} autoplay playsinline loop muted preload="auto" poster={videoPoster}>
|
||||
<video src={video} autoplay playsinline loop muted preload="auto"
|
||||
poster={videoPoster}>
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue