southseact-3d/shopify-ai-backup
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Restore to commit 74e578279624c6045ca440a3459ebfa1f8d54191

Browse Source
This commit is contained in:
southseact-3d
2026-02-07 20:32:41 +00:00
commit ed67b7741b
252 changed files with 99814 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
chat_v2/public/styles.css Normal file
View File

@@ -0,0 +1,71 @@
/* Copy of original styles for the chat UI */
:root { --bg: #fbf6ef; --panel: #fffaf2; --panel-strong: #f3e9d8; --border: rgba(0,0,0,0.06); --accent: #004225; --accent-2: #006B3D; --muted: #6b6b6b; --text: #2b2b2b; --danger: #b00020; --font-body: "Space Grotesk", "Inter", system-ui, -apple-system, sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font-body); min-height: 100vh; }
.app-shell { display: grid; grid-template-columns: 320px 1fr; min-height: 100vh; }
.sidebar { background: var(--panel); border-right: 1px solid var(--border); padding: 20px; display: flex; flex-direction: column; gap: 18px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 42px; height: 42px; border-radius: 10px; background: linear-gradient(135deg, var(--accent), var(--accent-2)); display: grid; place-items: center; color: #fff; font-weight: 700; letter-spacing: 0.4px; }
.brand-title { font-weight: 700; letter-spacing: 0.2px; } .brand-sub { color: var(--muted); font-size: 13px; }
.primary { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #fff; border: none; border-radius: 12px; padding: 12px 14px; font-weight: 700; cursor: pointer; transition: transform 120ms ease, box-shadow 120ms ease; }
.primary:hover { transform: translateY(-1px); box-shadow: 0 10px 25px rgba(0, 66, 37, 0.18); } button { font-family: inherit; } button:disabled { opacity: 0.5; cursor: not-allowed; }
.sidebar-section { border: 1px solid var(--border); border-radius: 14px; padding: 12px; background: rgba(255,255,255,0.02); display: flex; flex-direction: column; gap: 10px; }
.sidebar-section.slim { gap: 8px; } .section-heading { color: var(--muted); font-size: 12px; letter-spacing: 0.4px; text-transform: uppercase; }
.session-list { display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow: auto; } .session-item { padding: 12px; border-radius: 12px; border: 1px solid var(--border); background: var(--panel); cursor: pointer; transition: border-color 120ms ease, transform 120ms ease; position: relative; }
.session-item:hover { border-color: rgba(0, 66, 37, 0.6); transform: translateX(2px); } .session-item.active { border-color: var(--accent); background: rgba(0, 66, 37, 0.06); }
.session-title { font-weight: 600; margin-bottom: 4px; } .session-meta { display: flex; gap: 8px; color: var(--muted); font-size: 12px; }
.badge { padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,0.06); }
.badge.accent { background: rgba(0, 66, 37, 0.12); color: #e0f4ea; }
/* Delete button and confirmation menu */
.session-item .session-delete { position: absolute; right: 10px; top: 8px; display: flex; gap: 6px; align-items: center; }
.session-delete button.delete-btn { display: none; border: none; background: transparent; cursor: pointer; color: var(--muted); padding: 6px; border-radius: 6px; }
.session-item:hover .session-delete button.delete-btn { display: inline-flex; }
.session-delete button.delete-btn:hover { color: var(--danger); background: rgba(176, 0, 32, 0.06); }
.session-delete .delete-menu { display: none; position: absolute; right: 0; top: 34px; background: var(--panel); border: 1px solid var(--border); padding: 8px; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,0.08); z-index: 30; width: 240px; }
.session-item.show-delete-menu .session-delete .delete-menu { display: block; }
.session-delete .delete-menu .title { font-weight: 700; margin-bottom: 6px; }
.session-delete .delete-menu .actions { display:flex; gap:8px; justify-content:flex-end; }
.session-delete .delete-menu button.confirm-delete { background: rgba(176,0,32,0.12); color: var(--danger); border: none; padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.session-delete .delete-menu button.cancel-delete { background: transparent; border: 1px dashed var(--border); padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.git-actions { display: flex; flex-direction: column; gap: 8px; }
.git-actions button { background: rgba(255,255,255,0.05); color: var(--text); border: 1px solid var(--border); border-radius: 10px; padding: 10px; text-align: left; cursor: pointer; }
.git-actions button:hover { border-color: rgba(0, 66, 37, 0.6); } .git-actions input { width: 100%; padding: 10px; border-radius: 10px; border: 1px solid var(--border); background: var(--panel); color: var(--text); }
.git-output { min-height: 40px; font-size: 12px; color: var(--muted); white-space: pre-wrap; background: var(--panel); border: 1px dashed var(--border); border-radius: 10px; padding: 8px; }
.raw-output { font-family: monospace; background: var(--panel); border: 1px solid var(--border); padding: 8px; margin-top: 8px; white-space: pre-wrap; }
.attachments { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.attachment-image { border-radius: 8px; box-shadow: 0 6px 16px rgba(0,0,0,0.06); }
.main { padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.topbar { display: flex; justify-content: space-between; align-items: center; } .crumb { color: var(--muted); font-size: 13px; } .title { font-size: 24px; font-weight: 700; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.model-select { display: flex; align-items: center; gap: 8px; background: var(--panel); padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; }
.model-select select { background: transparent; color: var(--text); border: none; font-weight: 600; }
.queue-indicator { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border); background: rgba(255,255,255,0.05); min-width: 120px; text-align: center; }
.panel { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; background: var(--panel-strong); border: 1px solid var(--border); border-radius: 14px; padding: 14px; }
.label { color: var(--muted); font-size: 12px; letter-spacing: 0.3px; }
.value { font-weight: 700; }
.chat-area { flex: 1; border: 1px solid var(--border); border-radius: 16px; background: #fff; padding: 16px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; min-height: 420px; }
.empty-message { text-align: center; margin-top: 100px; }
.empty-message { text-align: center; margin-top: 100px; }
.message { padding: 12px 14px; border-radius: 12px; border: 1px solid var(--border); position: relative; }
.message.user { background: rgba(224, 123, 57, 0.06); border-color: rgba(224, 123, 57, 0.12); }
.message.assistant { background: rgba(240,240,240,1); }
.message .meta { display: flex; gap: 10px; align-items: center; color: var(--muted); font-size: 12px; margin-bottom: 6px; }
.message .body { white-space: pre-wrap; line-height: 1.5; }
.status-chip { border-radius: 999px; padding: 4px 8px; border: 1px solid var(--border); font-size: 12px; }
.status-chip.running { border-color: var(--accent-2); color: var(--accent-2); }
.status-chip.queued { color: var(--muted); }
.status-chip.done { border-color: var(--accent); color: #e0f4ea; }
.status-chip.error { border-color: var(--danger); color: var(--danger); }
.composer { border: 1px solid var(--border); border-radius: 16px; padding: 14px; background: var(--panel); display: flex; flex-direction: column; gap: 10px; }
.prompt-helpers { display: flex; gap: 8px; flex-wrap: wrap; }
.ghost { background: transparent; border: 1px dashed var(--border); color: var(--text); border-radius: 10px; padding: 8px 10px; cursor: pointer; }
.input-row { display: grid; grid-template-columns: 1fr 140px; gap: 10px; }
textarea { width: 100%; border: 1px solid var(--border); border-radius: 12px; background: #fff; color: var(--text); padding: 12px; font-family: var(--font-body); resize: vertical; }
.status-line { color: var(--muted); font-size: 12px; min-height: 16px; }
.muted { color: var(--muted); }
@media (max-width: 1080px) { .app-shell { grid-template-columns: 1fr; } .sidebar { order: 2; } .main { order: 1; } }
/* Modal styles */
.modal { display: none; align-items: center; justify-content: center; position: fixed; inset: 0; z-index: 10000; }
.modal > div { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 16px; }
.modal button.ghost { background: transparent; border: 1px solid var(--border); padding: 8px 10px; border-radius: 8px; color: var(--text); }