a46b9dc928
* Make /home install-hero links readable against blue background The Claude license-options link added in the previous commit inherited the default `<a>` style (`var(--hp-primary)` blue), which renders as blue-on-blue and is unreadable inside the blue install-hero. Add a scoped `.install-hero a` rule that uses white with an underline (matching the existing lead-paragraph contrast pattern) so any link nested in the hero stays legible. * Reorder /home install flow: auto-mode is now Step 2, Agnes install becomes Step 3 Step 3 (was Step 2) pastes a ~20-command bash bootstrap into a fresh Claude Code session. Without auto-mode enabled first, each Bash/edit command needs a manual approve click — bad UX for first-time users. Move auto-mode from the outside-hero `<details>` reference block into the install-hero as a real Step 2, between "install Claude Code" and "install Agnes". Content is the persistent `acceptEdits` snippet (write to ~/.claude/settings.json) plus a one-liner pointing at Shift+Tab for users who are already inside a running Claude Code session. YOLO mode for full Bash auto-approve stays on /setup-advanced behind the existing link. The outside-hero `setup-collapsible[data-section="step3"]` block is dropped — auto-mode is no longer reference content, it's a real install step, and duplicating it would just diverge over time. Onboarded users no longer see the auto-mode block at all (consistent with Steps 1 + 3 also hiding post-onboarding). Completion banner copy updated: "Step 1, 2 & 3 done — Claude Code installed, auto-mode set, Agnes ready". Dashboard CTA partial and other templates don't reference step numbers for this flow, so no adaptation needed there. * Simplify /home Step 2 to Shift+Tab only — drop the JSON snippet Operator pointed out two issues with the prior Step 2: 1. The settings.json snippet is redundant. Claude Code's first Shift+Tab cycle to auto-accept mode already prompts the user whether to persist it as default — Claude writes the config itself, no manual file edit needed. 2. The snippet only showed the POSIX path `~/.claude/settings.json`, which doesn't translate to native Windows. Replace the snippet + copy button with a plain Shift+Tab instruction, explicitly call out the first-time "make this the default?" prompt, and note that Claude handles the config write itself — same flow on macOS / Linux / WSL / Windows. Adds a fallback line for users who already closed the post-OAuth session. * Tighten /home Step 2 install-note to two paragraphs Operator: drop the 'Claude writes the setting itself, so this works the same on macOS / Linux / WSL / Windows...' line plus the 'auto-approves file edits going forward; Bash commands stay gated — that's the safe default' line. Both were filler — the make-default prompt already implies persistence, and gated Bash is the obvious default users won't be surprised by. Result: paragraph 1 carries Shift+Tab + first-time make-default say-yes + closed-session fallback in one breath; paragraph 2 keeps the verbatim YOLO link. Same affordances, less vertical space.
150 lines
4.5 KiB
HTML
150 lines
4.5 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Home — {{ instance_name or "AI Data Analyst" }}{% endblock %}
|
|
|
|
{% block content %}
|
|
{% include "_page_chrome.html" %}
|
|
<style>
|
|
.home-mock {
|
|
--hp-primary: #0073D1;
|
|
--hp-primary-dark: #0056A3;
|
|
--hp-primary-light: #E6F3FC;
|
|
--hp-border: #E5E7EB;
|
|
--hp-border-light: #F3F4F6;
|
|
--hp-text-primary: #111827;
|
|
--hp-text-secondary: #6B7280;
|
|
color: var(--hp-text-primary);
|
|
font-size: 14px;
|
|
line-height: 1.5;
|
|
}
|
|
.home-mock * { box-sizing: border-box; }
|
|
|
|
.home-mock .hero {
|
|
background: linear-gradient(135deg, #0073D1 0%, #0056A3 100%);
|
|
color: white;
|
|
border-radius: 16px;
|
|
padding: 38px 40px;
|
|
margin-bottom: 22px;
|
|
box-shadow: 0 8px 24px rgba(0, 86, 163, 0.18);
|
|
}
|
|
.home-mock .hero .eyebrow {
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.8px;
|
|
opacity: 0.85;
|
|
margin-bottom: 10px;
|
|
}
|
|
.home-mock .hero h1 {
|
|
font-size: 30px;
|
|
font-weight: 600;
|
|
letter-spacing: -0.4px;
|
|
margin-bottom: 12px;
|
|
line-height: 1.2;
|
|
color: white;
|
|
}
|
|
.home-mock .hero p {
|
|
font-size: 15px;
|
|
opacity: 0.94;
|
|
max-width: 680px;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.home-mock .section-label {
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.6px;
|
|
color: var(--hp-text-secondary);
|
|
margin: 30px 0 12px;
|
|
}
|
|
|
|
.home-mock .quick-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
|
|
gap: 18px;
|
|
margin-bottom: 18px;
|
|
}
|
|
.home-mock .quick-card {
|
|
background: white;
|
|
border: 1px solid var(--hp-border);
|
|
border-radius: 12px;
|
|
padding: 22px;
|
|
text-decoration: none;
|
|
color: inherit;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
transition: border-color .15s, box-shadow .15s;
|
|
}
|
|
.home-mock .quick-card:hover {
|
|
border-color: var(--hp-primary);
|
|
box-shadow: 0 4px 12px rgba(0, 115, 209, 0.10);
|
|
}
|
|
.home-mock .quick-card .ico {
|
|
font-size: 22px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.home-mock .quick-card .ttl {
|
|
font-size: 15px;
|
|
font-weight: 600;
|
|
color: var(--hp-text-primary);
|
|
}
|
|
.home-mock .quick-card .desc {
|
|
font-size: 13px;
|
|
color: var(--hp-text-secondary);
|
|
line-height: 1.55;
|
|
}
|
|
</style>
|
|
|
|
<div class="home-mock">
|
|
{% set display_name = (user.name or (user.email or "").split("@")[0] or "back") %}
|
|
|
|
<div class="hero">
|
|
<div class="eyebrow">Welcome back, {{ display_name }}</div>
|
|
<h1>You're all set up</h1>
|
|
<p>
|
|
Open Claude Code in any project under <code style="background: rgba(255,255,255,0.12); padding: 1px 6px; border-radius: 4px; font-family: ui-monospace, 'SF Mono', Consolas, monospace; font-size: 12.5px;">~/Agnes/Projects/</code>
|
|
and start a session — your data and plugins are already synced. Use the cards below to jump into the parts of {{ instance_name or "Agnes" }} you need.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="section-label">Quick links</div>
|
|
|
|
<div class="quick-grid">
|
|
<a class="quick-card" href="/dashboard">
|
|
<span class="ico">📊</span>
|
|
<div class="ttl">Dashboard</div>
|
|
<div class="desc">Sync state, table inventory, recent activity.</div>
|
|
</a>
|
|
<a class="quick-card" href="/catalog">
|
|
<span class="ico">📚</span>
|
|
<div class="ttl">Catalog</div>
|
|
<div class="desc">Browse tables, schema, and metric definitions.</div>
|
|
</a>
|
|
{# Activity Center + Corporate Memory both admin-only — parity
|
|
with the top-nav gating (Memory link hidden for non-admin in
|
|
_app_header.html, /corporate-memory route is `require_admin`,
|
|
same for the active /home not-onboarded view). #}
|
|
{% if is_admin %}
|
|
<a class="quick-card" href="/activity-center">
|
|
<span class="ico">📈</span>
|
|
<div class="ttl">Activity Center</div>
|
|
<div class="desc">Per-user analytics on Agnes adoption.</div>
|
|
</a>
|
|
<a class="quick-card" href="/corporate-memory">
|
|
<span class="ico">🧠</span>
|
|
<div class="ttl">Corporate Memory</div>
|
|
<div class="desc">Shared analyst knowledge and prior solutions.</div>
|
|
</a>
|
|
{% endif %}
|
|
{% if is_admin %}
|
|
<a class="quick-card" href="/admin/server-config">
|
|
<span class="ico">⚙️</span>
|
|
<div class="ttl">Admin</div>
|
|
<div class="desc">Server configuration, RBAC, marketplaces.</div>
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|