Reconcile the accepted homepage with its prominent robot mascot hero
Hop-State: A_06FN5D0QEMY5BNEY1J9Q20G Hop-Proposal: R_06FN5CZ847XQQ480QZYYFTR Hop-Task: T_06FN50V05VH5V9WE9QQF9KR Hop-Attempt: AT_06FN5CRY3J9322XVY1HMMA0
This commit is contained in:
@@ -44,6 +44,17 @@
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.hop-agent-hero {
|
||||
align-items: center;
|
||||
display: grid;
|
||||
gap: clamp(2.5rem, 5vw, 5rem);
|
||||
grid-template-columns: minmax(0, 1fr) clamp(280px, 29vw, 400px);
|
||||
}
|
||||
|
||||
.hop-agent-hero-copy {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.hop-agent-hero h1 {
|
||||
font-size: clamp(3.2rem, 6.1vw, 5.5rem);
|
||||
font-weight: 700;
|
||||
@@ -87,6 +98,23 @@
|
||||
margin-top: 1.2rem !important;
|
||||
}
|
||||
|
||||
.hop-agent-mascot {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0;
|
||||
min-width: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hop-agent-mascot img {
|
||||
display: block;
|
||||
filter: drop-shadow(0 1.5rem 2.5rem color-mix(in srgb, var(--color-primary) 18%, transparent));
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.hop-agent-flow {
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
display: grid;
|
||||
@@ -244,6 +272,14 @@
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.hop-agent-hero {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.hop-agent-mascot img {
|
||||
width: min(70vw, 320px);
|
||||
}
|
||||
|
||||
.hop-agent-flow {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
@@ -263,6 +299,10 @@
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.hop-agent-mascot img {
|
||||
width: min(72vw, 260px);
|
||||
}
|
||||
|
||||
.hop-agent-actions {
|
||||
align-items: stretch;
|
||||
flex-direction: column;
|
||||
@@ -352,19 +392,24 @@
|
||||
</style>
|
||||
<main id="hop-main" tabindex="-1" role="main" aria-label="Hop, agent-first version control" class="page-content hop-agent-home">
|
||||
<section class="hop-agent-hero" aria-labelledby="hop-agent-title">
|
||||
<p class="hop-agent-label">Agent-first version control</p>
|
||||
<h1 id="hop-agent-title"><span>Tell agents what to build.</span><span>Hop handles the Git.</span></h1>
|
||||
<p class="hop-agent-lede">Run one coding agent or many. Hop captures the request, isolates every attempt, combines concurrent edits, and routes real conflicts through an agent reconciliation loop. Once checks pass, the agent lands the result automatically by default. You do not have to manage a branch or write a commit.</p>
|
||||
<div class="hop-agent-actions">
|
||||
{{if .IsSigned}}
|
||||
<a class="ui primary button" href="{{AppSubUrl}}/repo/create">Create a repository</a>
|
||||
<a class="ui basic button" href="{{AppSubUrl}}/explore/repos">Explore repositories</a>
|
||||
{{else}}
|
||||
<a class="ui primary button" href="{{AppSubUrl}}/user/sign_up">Create a Hop account</a>
|
||||
<a class="ui basic button" href="#why-hop">Why use Hop?</a>
|
||||
{{end}}
|
||||
<div class="hop-agent-hero-copy">
|
||||
<p class="hop-agent-label">Agent-first version control</p>
|
||||
<h1 id="hop-agent-title"><span>Tell agents what to build.</span><span>Hop handles the Git.</span></h1>
|
||||
<p class="hop-agent-lede">Run one coding agent or many. Hop captures the request, isolates every attempt, combines concurrent edits, and routes real conflicts through an agent reconciliation loop. Once checks pass, the agent lands the result automatically by default. You do not have to manage a branch or write a commit.</p>
|
||||
<div class="hop-agent-actions">
|
||||
{{if .IsSigned}}
|
||||
<a class="ui primary button" href="{{AppSubUrl}}/repo/create">Create a repository</a>
|
||||
<a class="ui basic button" href="{{AppSubUrl}}/explore/repos">Explore repositories</a>
|
||||
{{else}}
|
||||
<a class="ui primary button" href="{{AppSubUrl}}/user/sign_up">Create a Hop account</a>
|
||||
<a class="ui basic button" href="#why-hop">Why use Hop?</a>
|
||||
{{end}}
|
||||
</div>
|
||||
<p class="hop-agent-note">Git stays underneath for compatibility. The mechanics disappear from your workflow.</p>
|
||||
</div>
|
||||
<p class="hop-agent-note">Git stays underneath for compatibility. The mechanics disappear from your workflow.</p>
|
||||
<figure class="hop-agent-mascot">
|
||||
<img src="{{AssetUrlPrefix}}/img/hop.svg?v=4" alt="Hop robot mascot" width="512" height="512" decoding="async" fetchpriority="high">
|
||||
</figure>
|
||||
</section>
|
||||
|
||||
<section class="hop-agent-flow" aria-labelledby="hop-agent-flow-title">
|
||||
|
||||
Reference in New Issue
Block a user