Brand page
BIN
packages/console/app/src/asset/brand/opencode-logo-dark.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
16
packages/console/app/src/asset/brand/opencode-logo-dark.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg width="240" height="300" viewBox="0 0 240 300" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1401_86283)">
|
||||
<mask id="mask0_1401_86283" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="240" height="300">
|
||||
<path d="M240 0H0V300H240V0Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1401_86283)">
|
||||
<path d="M180 240H60V120H180V240Z" fill="#4B4646"/>
|
||||
<path d="M180 60H60V240H180V60ZM240 300H0V0H240V300Z" fill="#F1ECEC"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1401_86283">
|
||||
<rect width="240" height="300" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 593 B |
BIN
packages/console/app/src/asset/brand/opencode-logo-light.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
16
packages/console/app/src/asset/brand/opencode-logo-light.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg width="240" height="300" viewBox="0 0 240 300" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1401_86274)">
|
||||
<mask id="mask0_1401_86274" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="240" height="300">
|
||||
<path d="M240 0H0V300H240V0Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1401_86274)">
|
||||
<path d="M180 240H60V120H180V240Z" fill="#CFCECD"/>
|
||||
<path d="M180 60H60V240H180V60ZM240 300H0V0H240V300Z" fill="#211E1E"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1401_86274">
|
||||
<rect width="240" height="300" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 593 B |
BIN
packages/console/app/src/asset/brand/opencode-wordmark-dark.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
@@ -0,0 +1,30 @@
|
||||
<svg width="641" height="115" viewBox="0 0 641 115" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1401_86292)">
|
||||
<mask id="mask0_1401_86292" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="641" height="115">
|
||||
<path d="M640.714 0H0V115H640.714V0Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1401_86292)">
|
||||
<path d="M49.2868 82.1433H16.4297V49.2861H49.2868V82.1433Z" fill="#4B4646"/>
|
||||
<path d="M49.2857 32.8573H16.4286V82.143H49.2857V32.8573ZM65.7143 98.5716H0V16.4287H65.7143V98.5716Z" fill="#B7B1B1"/>
|
||||
<path d="M131.427 82.1433H98.5703V49.2861H131.427V82.1433Z" fill="#4B4646"/>
|
||||
<path d="M98.5692 82.143H131.426V32.8573H98.5692V82.143ZM147.855 98.5716H98.5692V115H82.1406V16.4287H147.855V98.5716Z" fill="#B7B1B1"/>
|
||||
<path d="M229.997 65.7139V82.1424H180.711V65.7139H229.997Z" fill="#4B4646"/>
|
||||
<path d="M230.003 65.7144H180.718V82.143H230.003V98.5716H164.289V16.4287H230.003V65.7144ZM180.718 49.2859H213.575V32.8573H180.718V49.2859Z" fill="#B7B1B1"/>
|
||||
<path d="M295.717 98.5718H262.859V49.2861H295.717V98.5718Z" fill="#4B4646"/>
|
||||
<path d="M295.715 32.8573H262.858V98.5716H246.43V16.4287H295.715V32.8573ZM312.144 98.5716H295.715V32.8573H312.144V98.5716Z" fill="#B7B1B1"/>
|
||||
<path d="M394.286 82.1433H345V49.2861H394.286V82.1433Z" fill="#4B4646"/>
|
||||
<path d="M394.285 32.8573H344.999V82.143H394.285V98.5716H328.57V16.4287H394.285V32.8573Z" fill="#F1ECEC"/>
|
||||
<path d="M459.998 82.1433H427.141V49.2861H459.998V82.1433Z" fill="#4B4646"/>
|
||||
<path d="M459.997 32.8573H427.14V82.143H459.997V32.8573ZM476.425 98.5716H410.711V16.4287H476.425V98.5716Z" fill="#F1ECEC"/>
|
||||
<path d="M542.146 82.1433H509.289V49.2861H542.146V82.1433Z" fill="#4B4646"/>
|
||||
<path d="M542.145 32.8571H509.288V82.1429H542.145V32.8571ZM558.574 98.5714H492.859V16.4286H542.145V0H558.574V98.5714Z" fill="#F1ECEC"/>
|
||||
<path d="M640.715 65.7139V82.1424H591.43V65.7139H640.715Z" fill="#4B4646"/>
|
||||
<path d="M591.429 32.8573V49.2859H624.286V32.8573H591.429ZM640.714 65.7144H591.429V82.143H640.714V98.5716H575V16.4287H640.714V65.7144Z" fill="#F1ECEC"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1401_86292">
|
||||
<rect width="640.714" height="115" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
BIN
packages/console/app/src/asset/brand/opencode-wordmark-light.png
Normal file
|
After Width: | Height: | Size: 2.7 KiB |
@@ -0,0 +1,30 @@
|
||||
<svg width="640" height="115" viewBox="0 0 640 115" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1401_86330)">
|
||||
<mask id="mask0_1401_86330" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="640" height="115">
|
||||
<path d="M640 0H0V115H640V0Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1401_86330)">
|
||||
<path d="M49.2346 82.1433H16.4141V49.2861H49.2346V82.1433Z" fill="#CFCECD"/>
|
||||
<path d="M49.2308 32.8573H16.4103V82.143H49.2308V32.8573ZM65.641 98.5716H0V16.4287H65.641V98.5716Z" fill="#656363"/>
|
||||
<path d="M131.281 82.1433H98.4609V49.2861H131.281V82.1433Z" fill="#CFCECD"/>
|
||||
<path d="M98.4649 82.143H131.285V32.8573H98.4649V82.143ZM147.696 98.5716H98.4649V115H82.0547V16.4287H147.696V98.5716Z" fill="#656363"/>
|
||||
<path d="M229.746 65.7139V82.1424H180.516V65.7139H229.746Z" fill="#CFCECD"/>
|
||||
<path d="M229.743 65.7144H180.512V82.143H229.743V98.5716H164.102V16.4287H229.743V65.7144ZM180.512 49.2859H213.332V32.8573H180.512V49.2859Z" fill="#656363"/>
|
||||
<path d="M295.383 98.5718H262.562V49.2861H295.383V98.5718Z" fill="#CFCECD"/>
|
||||
<path d="M295.387 32.8573H262.567V98.5716H246.156V16.4287H295.387V32.8573ZM311.797 98.5716H295.387V32.8573H311.797V98.5716Z" fill="#656363"/>
|
||||
<path d="M393.848 82.1433H344.617V49.2861H393.848V82.1433Z" fill="#CFCECD"/>
|
||||
<path d="M393.844 32.8573H344.613V82.143H393.844V98.5716H328.203V16.4287H393.844V32.8573Z" fill="#211E1E"/>
|
||||
<path d="M459.485 82.1433H426.664V49.2861H459.485V82.1433Z" fill="#CFCECD"/>
|
||||
<path d="M459.489 32.8573H426.668V82.143H459.489V32.8573ZM475.899 98.5716H410.258V16.4287H475.899V98.5716Z" fill="#211E1E"/>
|
||||
<path d="M541.539 82.1433H508.719V49.2861H541.539V82.1433Z" fill="#CFCECD"/>
|
||||
<path d="M541.535 32.8571H508.715V82.1428H541.535V32.8571ZM557.946 98.5714H492.305V16.4286H541.535V0H557.946V98.5714Z" fill="#211E1E"/>
|
||||
<path d="M639.996 65.7139V82.1424H590.766V65.7139H639.996Z" fill="#CFCECD"/>
|
||||
<path d="M590.77 32.8573V49.2859H623.59V32.8573H590.77ZM640 65.7144H590.77V82.143H640V98.5716H574.359V16.4287H640V65.7144Z" fill="#211E1E"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1401_86330">
|
||||
<rect width="640" height="115" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
@@ -0,0 +1,22 @@
|
||||
<svg width="641" height="115" viewBox="0 0 641 115" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1401_86315)">
|
||||
<mask id="mask0_1401_86315" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="641" height="115">
|
||||
<path d="M640.714 0H0V115H640.714V0Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1401_86315)">
|
||||
<path d="M49.2857 32.8573H16.4286V82.143H49.2857V32.8573ZM65.7143 98.5716H0V16.4287H65.7143V98.5716Z" fill="#F1ECEC"/>
|
||||
<path d="M98.5692 82.143H131.426V32.8573H98.5692V82.143ZM147.855 98.5716H98.5692V115H82.1406V16.4287H147.855V98.5716Z" fill="#F1ECEC"/>
|
||||
<path d="M230.003 65.7144H180.718V82.143H230.003V98.5716H164.289V16.4287H230.003V65.7144ZM180.718 49.2859H213.575V32.8573H180.718V49.2859Z" fill="#F1ECEC"/>
|
||||
<path d="M295.715 32.8573H262.858V98.5716H246.43V16.4287H295.715V32.8573ZM312.144 98.5716H295.715V32.8573H312.144V98.5716Z" fill="#F1ECEC"/>
|
||||
<path d="M394.285 32.8573H344.999V82.143H394.285V98.5716H328.57V16.4287H394.285V32.8573Z" fill="#F1ECEC"/>
|
||||
<path d="M459.997 32.8573H427.14V82.143H459.997V32.8573ZM476.425 98.5716H410.711V16.4287H476.425V98.5716Z" fill="#F1ECEC"/>
|
||||
<path d="M542.145 32.8571H509.288V82.1429H542.145V32.8571ZM558.574 98.5714H492.859V16.4286H542.145V0H558.574V98.5714Z" fill="#F1ECEC"/>
|
||||
<path d="M591.429 32.8573V49.2859H624.286V32.8573H591.429ZM640.714 65.7144H591.429V82.143H640.714V98.5716H575V16.4287H640.714V65.7144Z" fill="#F1ECEC"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1401_86315">
|
||||
<rect width="640.714" height="115" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
@@ -0,0 +1,22 @@
|
||||
<svg width="640" height="115" viewBox="0 0 640 115" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1401_86353)">
|
||||
<mask id="mask0_1401_86353" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="640" height="115">
|
||||
<path d="M640 0H0V115H640V0Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1401_86353)">
|
||||
<path d="M49.2308 32.8573H16.4103V82.143H49.2308V32.8573ZM65.641 98.5716H0V16.4287H65.641V98.5716Z" fill="#211E1E"/>
|
||||
<path d="M98.4649 82.143H131.285V32.8573H98.4649V82.143ZM147.696 98.5716H98.4649V115H82.0547V16.4287H147.696V98.5716Z" fill="#211E1E"/>
|
||||
<path d="M229.743 65.7144H180.512V82.143H229.743V98.5716H164.102V16.4287H229.743V65.7144ZM180.512 49.2859H213.332V32.8573H180.512V49.2859Z" fill="#211E1E"/>
|
||||
<path d="M295.387 32.8573H262.567V98.5716H246.156V16.4287H295.387V32.8573ZM311.797 98.5716H295.387V32.8573H311.797V98.5716Z" fill="#211E1E"/>
|
||||
<path d="M393.844 32.8573H344.613V82.143H393.844V98.5716H328.203V16.4287H393.844V32.8573Z" fill="#211E1E"/>
|
||||
<path d="M459.489 32.8573H426.668V82.143H459.489V32.8573ZM475.899 98.5716H410.258V16.4287H475.899V98.5716Z" fill="#211E1E"/>
|
||||
<path d="M541.535 32.8571H508.715V82.1428H541.535V32.8571ZM557.946 98.5714H492.305V16.4286H541.535V0H557.946V98.5714Z" fill="#211E1E"/>
|
||||
<path d="M590.77 32.8573V49.2859H623.59V32.8573H590.77ZM640 65.7144H590.77V82.143H640V98.5716H574.359V16.4287H640V65.7144Z" fill="#211E1E"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1401_86353">
|
||||
<rect width="640" height="115" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
BIN
packages/console/app/src/asset/brand/preview-opencode-dark.png
Normal file
|
After Width: | Height: | Size: 302 B |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 70 KiB After Width: | Height: | Size: 7.6 KiB |
@@ -1,3 +1,5 @@
|
||||
import { A } from "@solidjs/router"
|
||||
|
||||
export function Legal() {
|
||||
return (
|
||||
<div data-component="legal">
|
||||
@@ -5,10 +7,7 @@ export function Legal() {
|
||||
©{new Date().getFullYear()} <a href="https://anoma.ly">Anomaly</a>
|
||||
</span>
|
||||
<span>
|
||||
<a href="/brand">Brand</a>
|
||||
</span>
|
||||
<span>
|
||||
<a href="/legal">Legal</a>
|
||||
<A href="/brand">Brand</A>
|
||||
</span>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -294,10 +294,12 @@
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
width: fit-content;
|
||||
gap: 32px;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
transition: background-color 0.2s ease;
|
||||
text-decoration: none;
|
||||
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: var(--color-background-strong-hover);
|
||||
}
|
||||
@@ -308,14 +310,83 @@
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: block;
|
||||
[data-component="brand-grid"] {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 2rem;
|
||||
margin-top: 4rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
[data-component="brand-grid"] img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: block;
|
||||
border-radius: 4px;
|
||||
border: 1px solid var(--color-border-weak);
|
||||
}
|
||||
|
||||
[data-component="brand-grid"] > div {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
[data-component="actions"] {
|
||||
position: absolute;
|
||||
background: rgba(4, 0, 0, 0.08);
|
||||
border-radius: 4px;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease;
|
||||
|
||||
@media (max-width: 60rem) {
|
||||
position: static;
|
||||
opacity: 1;
|
||||
margin-top: 1rem;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
[data-component="brand-grid"] > div:hover [data-component="actions"] {
|
||||
opacity: 1;
|
||||
|
||||
@media (max-width: 60rem) {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
[data-component="actions"] button {
|
||||
padding: 6px 12px;
|
||||
background: var(--color-background);
|
||||
color: var(--color-text);
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
transition: background-color 0.2s ease;
|
||||
cursor: pointer;
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(19, 16, 16, 0.08),
|
||||
0 6px 8px -4px rgba(19, 16, 16, 0.12),
|
||||
0 4px 3px -2px rgba(19, 16, 16, 0.12),
|
||||
0 1px 2px -1px rgba(19, 16, 16, 0.12);
|
||||
|
||||
|
||||
&:hover {
|
||||
background: var(--color-background);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media (max-width: 60rem) {
|
||||
padding: 2rem 1.5rem;
|
||||
}
|
||||
|
||||
@@ -3,11 +3,23 @@ import { Title, Meta } from "@solidjs/meta"
|
||||
import { Header } from "~/component/header"
|
||||
import { Footer } from "~/component/footer"
|
||||
import { Legal } from "~/component/legal"
|
||||
import { Faq } from "~/component/faq"
|
||||
import brand from "../../asset/lander/brand.png"
|
||||
import previewLogoLight from "../../asset/brand/preview-opencode-logo-light.png"
|
||||
import previewLogoDark from "../../asset/brand/preview-opencode-logo-dark.png"
|
||||
import previewWordmarkLight from "../../asset/brand/preview-opencode-wordmark-light.png"
|
||||
import previewWordmarkDark from "../../asset/brand/preview-opencode-wordmark-dark.png"
|
||||
import previewWordmarkSimpleLight from "../../asset/brand/preview-opencode-wordmark-simple-light.png"
|
||||
import previewWordmarkSimpleDark from "../../asset/brand/preview-opencode-wordmark-simple-dark.png"
|
||||
|
||||
|
||||
export default function Brand() {
|
||||
const downloadFile = (url: string, filename: string) => {
|
||||
const link = document.createElement("a")
|
||||
link.href = url
|
||||
link.download = filename
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
}
|
||||
|
||||
return (
|
||||
<main data-page="enterprise">
|
||||
@@ -19,82 +31,183 @@ export default function Brand() {
|
||||
<div data-component="content">
|
||||
<section data-component="brand-content">
|
||||
<h2>Brand guidelines</h2>
|
||||
<p>
|
||||
Resources and assets to help you work with the OpenCode brand.
|
||||
</p>
|
||||
<a data-component="download-button" href="#">Download brand assets<svg
|
||||
width="24" height="24" viewBox="0 0 24 24" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 6.5L12 17M7.5 13L12 17.5L16.5 13" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="square"/>
|
||||
</svg>
|
||||
</a>
|
||||
<img src={brand} alt=""/>
|
||||
<p>Resources and assets to help you work with the OpenCode brand.</p>
|
||||
<button data-component="download-button">
|
||||
Download all assets
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<p>If you need any help with anything brand related <a href="mailto:david@anoma.ly">contact us</a>.</p>
|
||||
</section>
|
||||
|
||||
<section data-component="faq">
|
||||
<div data-slot="section-title">
|
||||
<h3>FAQ</h3>
|
||||
<div data-component="brand-grid">
|
||||
<div>
|
||||
<img src={previewLogoLight} alt="OpenCode brand guidelines"/>
|
||||
<div data-component="actions">
|
||||
<button
|
||||
onClick={() => downloadFile(LogoLight, "opencode-logo-light.png")}>
|
||||
PNG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button onClick={() => downloadFile(brandAssetsLight, "opencode-logo-light.svg")}>
|
||||
SVG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src={previewLogoDark} alt="OpenCode brand guidelines"/>
|
||||
<div data-component="actions">
|
||||
<button
|
||||
onClick={() => downloadFile(brand, "opencode-logo-dark.png")}>
|
||||
PNG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => downloadFile(brandAssetsLight, "opencode-logo-dark.svg")}>
|
||||
SVG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src={previewWordmarkLight} alt="OpenCode brand guidelines"/>
|
||||
<div data-component="actions">
|
||||
<button
|
||||
onClick={() => downloadFile(brand, "opencode-wordmark-light.png")}>
|
||||
PNG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-light.svg")}>
|
||||
SVG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src={previewWordmarkDark} alt="OpenCode brand guidelines"/>
|
||||
<div data-component="actions">
|
||||
<button
|
||||
onClick={() => downloadFile(brand, "opencode-wordmark-dark.png")}>
|
||||
PNG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-dark.svg")}>
|
||||
SVG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src={previewWordmarkSimpleLight} alt="OpenCode brand guidelines"/>
|
||||
<div data-component="actions">
|
||||
<button
|
||||
onClick={() => downloadFile(brand, "opencode-wordmark-simple-light.png")}>
|
||||
PNG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-simple-light.svg")}>
|
||||
SVG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src={previewWordmarkSimpleDark} alt="OpenCode brand guidelines"/>
|
||||
<div data-component="actions">
|
||||
<button
|
||||
onClick={() => downloadFile(brand, "opencode-wordmark-simple-dark.png")}>
|
||||
PNG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-simple-dark.svg")}>
|
||||
SVG
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
|
||||
stroke="currentColor" stroke-width="1.5"
|
||||
stroke-linecap="square"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<Faq question="Does Opencode store our code or context data?">
|
||||
No. OpenCode never stores your code or context data. All
|
||||
processing happens locally or directly with your AI provider.
|
||||
</Faq>
|
||||
</li>
|
||||
<li>
|
||||
<Faq question="Who owns the code generated with OpenCode?">
|
||||
You do. All code produced is yours, with no licensing
|
||||
restrictions or ownership claims.
|
||||
</Faq>
|
||||
</li>
|
||||
<li>
|
||||
<Faq
|
||||
question="How can we trial OpenCode inside our organization?">
|
||||
Simply install and run an internal trial with your team. Since
|
||||
OpenCode doesn’t store any data, your developers can get
|
||||
started right away.
|
||||
</Faq>
|
||||
</li>
|
||||
<li>
|
||||
<Faq
|
||||
question="What happens if someone uses the `/share` feature?">
|
||||
By default, sharing is disabled. If enabled, conversations are
|
||||
sent to our share service and cached through our CDN. For
|
||||
enterprise use, we recommend disabling or self-hosting this
|
||||
feature.
|
||||
</Faq>
|
||||
</li>
|
||||
<li>
|
||||
<Faq question="Can OpenCode integrate with our company’s SSO?">
|
||||
Yes. Enterprise deployments can include SSO integration so all
|
||||
sessions and shared conversations are protected by your
|
||||
authentication system.
|
||||
</Faq>
|
||||
</li>
|
||||
<li>
|
||||
<Faq question="Can OpenCode be self-hosted?">
|
||||
Absolutely. You can fully self-host OpenCode, including the
|
||||
share feature, ensuring that data and pages are accessible
|
||||
only after authentication.
|
||||
</Faq>
|
||||
</li>
|
||||
<li>
|
||||
<Faq
|
||||
question="How do we get started with enterprise deployment?">
|
||||
Contact us to discuss pricing, implementation, and enterprise
|
||||
options like SSO, private registries, and self-hosting.
|
||||
</Faq>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
<Footer />
|
||||
<Footer/>
|
||||
</div>
|
||||
<Legal />
|
||||
<Legal/>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
||||