archy/demo/aiui/assets/GuidePage-iT99cF_4.css
Dorian 1427dd47a3 feat: demo deployment with AIUI chat, SSH key auth, Quick Start fix
- Add AIUI pre-built dist to demo/ for Portainer deployment
- Add nginx-demo.conf with Claude API proxy (envsubst for API key)
- Add docker-entrypoint.sh for runtime API key injection
- Update Dockerfile.web to include AIUI and Claude proxy
- Update docker-compose.demo.yml with ANTHROPIC_API_KEY env var
- Switch deploy script from sshpass to SSH key auth
- Fix Quick Start Goals animating before other cards (stagger 5, opacity guard)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-07 19:52:33 +00:00

2 lines
3.4 KiB
CSS

.guide-page[data-v-a3ad5999]{min-height:100vh;background:#0a0a0a;color:#ffffffe6;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.guide-header[data-v-a3ad5999]{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;padding:16px 20px;background:#0009;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid rgba(255,255,255,.08)}.back-btn[data-v-a3ad5999]{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:#ffffffb3;cursor:pointer;transition:all .2s ease}.back-btn[data-v-a3ad5999]:hover{background:#ffffff1a;color:#fff}.guide-title[data-v-a3ad5999]{font-size:18px;font-weight:600;flex:1}.guide-version[data-v-a3ad5999]{font-size:12px;color:#fff6;padding:2px 8px;border-radius:6px;background:#ffffff0f}.guide-content[data-v-a3ad5999]{max-width:680px;margin:0 auto;padding:24px 20px 80px}.guide-intro[data-v-a3ad5999]{font-size:15px;line-height:1.7;color:#ffffffb3}.guide-section[data-v-a3ad5999]{margin-bottom:36px}.section-title[data-v-a3ad5999]{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:600;margin-bottom:12px;color:#fffffff2}.section-icon[data-v-a3ad5999]{font-size:20px}.section-desc[data-v-a3ad5999]{font-size:14px;line-height:1.7;color:#fff9;margin-bottom:16px}.section-desc code[data-v-a3ad5999]{background:#ffffff14;padding:2px 6px;border-radius:4px;font-size:13px;font-family:Menlo,monospace;color:#fffc}.example-box[data-v-a3ad5999]{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.example-prompt[data-v-a3ad5999]{padding:10px 14px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:10px;font-size:13px;color:#ffffffbf;font-style:italic}.info-note[data-v-a3ad5999]{padding:12px 16px;background:#f7931a14;border:1px solid rgba(247,147,26,.2);border-radius:10px;font-size:13px;line-height:1.6;color:#fff9}.feature-grid[data-v-a3ad5999]{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}.feature-card[data-v-a3ad5999]{padding:16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:12px}.feature-card h3[data-v-a3ad5999]{font-size:14px;font-weight:600;margin-bottom:6px;color:#ffffffe6}.feature-card p[data-v-a3ad5999]{font-size:13px;line-height:1.5;color:#ffffff80}.tips-list[data-v-a3ad5999]{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px}.tips-list li[data-v-a3ad5999]{padding:10px 14px 10px 28px;position:relative;background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:10px;font-size:13px;line-height:1.5;color:#fff9}.tips-list li[data-v-a3ad5999]:before{content:"•";position:absolute;left:14px;color:#f7931a}.demo-button[data-v-a3ad5999]{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px 20px;border-radius:12px;border:1px solid rgba(247,147,26,.3);background:#f7931a1a;color:#f7931a;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease}.demo-button[data-v-a3ad5999]:hover:not(:disabled){background:#f7931a2e;border-color:#f7931a80;transform:translateY(-1px)}.demo-button[data-v-a3ad5999]:disabled{opacity:.6;cursor:not-allowed}.demo-spinner[data-v-a3ad5999]{width:18px;height:18px;border:2px solid rgba(247,147,26,.3);border-top-color:#f7931a;border-radius:50%;animation:spin-a3ad5999 .8s linear infinite}@keyframes spin-a3ad5999{to{transform:rotate(360deg)}}