David Hill 2 месяцев назад
Родитель
Сommit
408cdaf5e0
2 измененных файлов с 52 добавлено и 25 удалено
  1. 13 3
      packages/console/app/src/routes/index.css
  2. 39 22
      packages/console/app/src/routes/index.tsx

+ 13 - 3
packages/console/app/src/routes/index.css

@@ -338,6 +338,11 @@ body {
     }
     }
   }
   }
 
 
+  [data-slot="installation-instructions"] {
+    color: var(--color-text-strong);
+    margin-bottom: 8px;
+  }
+
   [data-slot="installation"] {
   [data-slot="installation"] {
     width: 100%;
     width: 100%;
     max-width: 100%;
     max-width: 100%;
@@ -348,6 +353,11 @@ body {
     }
     }
   }
   }
 
 
+  [data-slot="installation-options"] {
+    font-size: 13px;
+    margin-top: 12px;
+  }
+
   [data-component="tabs"] {
   [data-component="tabs"] {
     [data-slot="tablist"] {
     [data-slot="tablist"] {
       display: flex;
       display: flex;
@@ -480,10 +490,10 @@ body {
     }
     }
 
 
     h1 {
     h1 {
-      font-size: 28px;
+      font-size: 38px;
       color: var(--color-text-strong);
       color: var(--color-text-strong);
       font-weight: 500;
       font-weight: 500;
-      margin-bottom: 16px;
+      margin-bottom: 8px;
 
 
       @media (max-width: 60rem) {
       @media (max-width: 60rem) {
         font-size: 22px;
         font-size: 22px;
@@ -492,7 +502,7 @@ body {
 
 
     p {
     p {
       color: var(--color-text);
       color: var(--color-text);
-      margin-bottom: 24px;
+      margin-bottom: 40px;
       max-width: 82%;
       max-width: 82%;
 
 
       @media (max-width: 50rem) {
       @media (max-width: 50rem) {

+ 39 - 22
packages/console/app/src/routes/index.tsx

@@ -43,7 +43,7 @@ export default function Home() {
   return (
   return (
     <main data-page="opencode">
     <main data-page="opencode">
       {/*<HttpHeader name="Cache-Control" value="public, max-age=1, s-maxage=3600, stale-while-revalidate=86400" />*/}
       {/*<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} />
       <Link rel="canonical" href={config.baseUrl} />
       <Meta property="og:image" content="/social-share.png" />
       <Meta property="og:image" content="/social-share.png" />
       <Meta name="twitter: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">
         <div data-component="content">
           <section data-component="hero">
           <section data-component="hero">
             <div data-slot="hero-copy">
             <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"}
                 What’s new in {release()?.name ?? "the latest release"}
               </a>
               </a>
-              <h1>The AI coding agent built for the terminal</h1>
+              <h1>The open source coding agent</h1>
               <p>
               <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>
               </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>
             </div>
+            <p data-slot="installation-instructions">
+              Install and use. No account, no email, and no credit card.
+            </p>
             <div data-slot="installation">
             <div data-slot="installation">
               <Tabs
               <Tabs
                 as="section"
                 as="section"
@@ -102,7 +109,8 @@ export default function Home() {
                 </Tabs.List>
                 </Tabs.List>
                 <div data-slot="panels">
                 <div data-slot="panels">
                   <Tabs.Content as="pre" data-slot="panel" value="curl">
                   <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 data-slot="command-script">
                         <span>curl -fsSL </span>
                         <span>curl -fsSL </span>
                         <span data-slot="protocol">https://</span>
                         <span data-slot="protocol">https://</span>
@@ -113,7 +121,8 @@ export default function Home() {
                     </button>
                     </button>
                   </Tabs.Content>
                   </Tabs.Content>
                   <Tabs.Content as="pre" data-slot="panel" value="npm">
                   <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>
                         <span data-slot="protocol">npm i -g </span>
                         <span data-slot="protocol">npm i -g </span>
                         <span data-slot="highlight">opencode-ai</span>
                         <span data-slot="highlight">opencode-ai</span>
@@ -122,7 +131,8 @@ export default function Home() {
                     </button>
                     </button>
                   </Tabs.Content>
                   </Tabs.Content>
                   <Tabs.Content as="pre" data-slot="panel" value="bun">
                   <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>
                         <span data-slot="protocol">bun add -g </span>
                         <span data-slot="protocol">bun add -g </span>
                         <span data-slot="highlight">opencode-ai</span>
                         <span data-slot="highlight">opencode-ai</span>
@@ -131,7 +141,8 @@ export default function Home() {
                     </button>
                     </button>
                   </Tabs.Content>
                   </Tabs.Content>
                   <Tabs.Content as="pre" data-slot="panel" value="brew">
                   <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>
                         <span data-slot="protocol">brew install </span>
                         <span data-slot="protocol">brew install </span>
                         <span data-slot="highlight">opencode</span>
                         <span data-slot="highlight">opencode</span>
@@ -140,7 +151,8 @@ export default function Home() {
                     </button>
                     </button>
                   </Tabs.Content>
                   </Tabs.Content>
                   <Tabs.Content as="pre" data-slot="panel" value="paru">
                   <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>
                         <span data-slot="protocol">paru -S </span>
                         <span data-slot="protocol">paru -S </span>
                         <span data-slot="highlight">opencode</span>
                         <span data-slot="highlight">opencode</span>
@@ -151,10 +163,15 @@ export default function Home() {
                 </div>
                 </div>
               </Tabs>
               </Tabs>
             </div>
             </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>
 
 
           <section data-component="video">
           <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.
               Your browser does not support the video tag.
             </video>
             </video>
           </section>
           </section>