接入ai
This commit is contained in:
+565
-498
File diff suppressed because it is too large
Load Diff
+666
-50
@@ -1,59 +1,675 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700&display=swap');
|
||||
|
||||
:root { font-family: Manrope, system-ui, sans-serif; color: #e9edf1; background: #090b0e; font-synthesis: none; --line: rgba(255,255,255,.085); --muted: #7e8791; }
|
||||
:root {
|
||||
font-family: Manrope, system-ui, sans-serif;
|
||||
color: #263941;
|
||||
background: #e7ecee;
|
||||
font-synthesis: none;
|
||||
--canvas: #e7ecee;
|
||||
--paper: #fbfcfb;
|
||||
--panel: #f6f8f7;
|
||||
--ink: #263941;
|
||||
--muted: #73828a;
|
||||
--line: rgba(45, 67, 78, .14);
|
||||
--teal: #347f82;
|
||||
--green: #26845e;
|
||||
--amber: #a66a24;
|
||||
--red: #a33d3d;
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
body { margin: 0; min-width: 1180px; min-height: 100vh; overflow: hidden; }
|
||||
button, textarea { font: inherit; }
|
||||
body { margin: 0; min-width: 1120px; min-height: 100vh; overflow: hidden; background: var(--canvas); }
|
||||
button, textarea, select { font: inherit; }
|
||||
button { color: inherit; }
|
||||
.app-shell { height: 100vh; display: grid; grid-template-columns: 340px 1fr; background: #0b0e12; }
|
||||
.chat-panel { background: #0d1014; border-right: 1px solid var(--line); display: flex; flex-direction: column; position: relative; z-index: 20; }
|
||||
.brand { height: 78px; display: flex; align-items: center; gap: 12px; padding: 0 22px; border-bottom: 1px solid var(--line); }
|
||||
.brand-mark { width: 35px; height: 35px; border: 1px solid #f1a64b55; display: grid; place-items: center; border-radius: 9px; background: #f1a64b0c; }
|
||||
.brand b { display:block; font-size: 15px; letter-spacing: .2em; }.brand span { display:block; font: 9px DM Mono; letter-spacing: .22em; color:#787f87; margin-top:3px; }
|
||||
.orbit-icon { width: 24px; height: 24px; position: relative; display: grid; place-items: center; }.orbit-icon:after { content:''; width:6px;height:6px;border-radius:50%;background:#f1a64b;box-shadow:0 0 14px #f1a64b; }
|
||||
.orbit-icon i { position:absolute; width:22px;height:8px;border:1px solid #f1a64b;border-radius:50%;transform:rotate(0deg); }.orbit-icon i:nth-child(2){transform:rotate(60deg)}.orbit-icon i:nth-child(3){transform:rotate(-60deg)}
|
||||
.chat-heading { height: 56px; padding: 0 20px; border-bottom:1px solid var(--line); display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.04em; }.chat-heading button{margin-left:auto;background:none;border:0;color:#6e7780;cursor:pointer}.live-dot{width:6px;height:6px;border-radius:50%;background:#68d391;box-shadow:0 0 9px #68d391}
|
||||
.messages { flex:1; overflow-y:auto; padding:18px 17px; scrollbar-width:none; }.date-label{text-align:center;font:9px DM Mono;color:#59616a;margin-bottom:18px}.message{display:flex;gap:8px;margin:0 0 16px;align-items:flex-start}.message.user{justify-content:flex-end}.avatar{width:25px;height:25px;border:1px solid #f1a64b44;border-radius:7px;display:grid;place-items:center;color:#f1a64b;flex:none}.bubble{max-width:250px;padding:11px 13px;border:1px solid var(--line);border-radius:4px 13px 13px 13px;background:#14181d;color:#b7bec6;font-size:12px;line-height:1.65}.user .bubble{background:#e6973f;color:#16110a;border-color:#e6973f;border-radius:13px 4px 13px 13px;font-weight:600}.spin{animation:spin 1s linear infinite;vertical-align:middle;margin-right:4px}@keyframes spin{to{transform:rotate(360deg)}}
|
||||
.prompt-suggestions{display:flex;gap:6px;padding:0 17px 9px}.prompt-suggestions button{border:1px solid var(--line);background:#12161a;border-radius:20px;padding:6px 10px;font-size:10px;color:#858e98;cursor:pointer}.prompt-suggestions button:hover{border-color:#f1a64b66;color:#f1a64b}
|
||||
.composer{margin:0 15px 16px;border:1px solid #ffffff18;background:#12161a;border-radius:13px;padding:11px;box-shadow:0 14px 40px #0005}.composer:focus-within{border-color:#f1a64b66}.composer textarea{width:100%;height:61px;resize:none;border:0;outline:0;background:transparent;color:#e5e9ed;font-size:12px;line-height:1.5}.composer-foot{display:flex;align-items:center;justify-content:space-between}.composer-foot span{display:flex;align-items:center;gap:5px;color:#68717b;font-size:9px}.composer-foot button{border:0;width:30px;height:30px;border-radius:8px;background:#efa246;color:#17100a;display:grid;place-items:center;cursor:pointer;transition:.2s}.composer-foot button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #efa24644}
|
||||
.workspace{min-width:0;background:#0b0e12}.topbar{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#0c0f13}.topbar>div:first-child{display:flex;align-items:center;gap:12px}.topbar>div:first-child span{font:9px DM Mono;color:#59616a;letter-spacing:.15em}.topbar>div:first-child b{font-size:13px}.top-actions{display:flex;align-items:center;gap:10px}.source-pill{font:9px DM Mono;color:#7c858f;border:1px solid var(--line);padding:7px 10px;border-radius:20px}.source-pill span{display:inline-block;width:5px;height:5px;border-radius:50%;background:#69d18f;margin-right:7px}.top-actions button,.account-avatar{width:32px;height:32px;border:1px solid var(--line);background:#12161a;border-radius:8px;display:grid;place-items:center}.account-avatar{background:#ddd;color:#17191b;font-size:11px;font-weight:800}
|
||||
.route-layer{height:calc(100vh - 78px)}.gallery{height:calc(100vh - 78px);overflow:auto;padding:38px 40px 28px;position:relative;background-image:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px);background-size:40px 40px}.gallery:before{content:'';position:fixed;inset:78px 0 0 340px;pointer-events:none;background:radial-gradient(circle at 60% 30%,#f1a64b0a,transparent 37%)}
|
||||
.gallery-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px;position:relative}.gallery-heading>div>span{display:flex;align-items:center;gap:7px;font:9px DM Mono;color:#e8a34d;letter-spacing:.15em}.gallery-heading h1{font-size:28px;letter-spacing:-.04em;margin:10px 0 4px}.gallery-heading p{color:#6e7781;font-size:11px;margin:0}.result-count{text-align:right;border-left:1px solid var(--line);padding-left:24px}.result-count b{display:block;font:26px DM Mono;color:#d5d9de}.result-count span{font-size:9px;color:#656e77}
|
||||
.candidate-grid{display:grid;grid-template-columns:repeat(3,minmax(250px,1fr));gap:14px;transition:.4s}.candidate-grid.muted{opacity:.1;filter:blur(5px)}.candidate{height:303px;border:1px solid var(--line);background:#101419;position:relative;overflow:hidden;cursor:pointer;opacity:0;transform:translateY(25px) scale(.97);transition:opacity .65s,transform .65s,border-color .25s,box-shadow .25s}.candidate.show{opacity:1;transform:none}.candidate:nth-child(2){transition-delay:.06s}.candidate:nth-child(3){transition-delay:.12s}.candidate:nth-child(4){transition-delay:.18s}.candidate:nth-child(5){transition-delay:.24s}.candidate:nth-child(6){transition-delay:.3s}.candidate:hover{border-color:color-mix(in srgb,var(--accent) 55%,transparent);transform:translateY(-4px);box-shadow:0 18px 50px #0007}.candidate-top{height:34px;position:absolute;z-index:5;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:11px 12px;font:9px DM Mono;color:#5c646d}.candidate-top em{font-style:normal;color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);background:color-mix(in srgb,var(--accent) 8%,transparent);padding:3px 7px;border-radius:10px}.mini-view{height:190px;position:relative}.mini-view canvas{transition:transform .6s}.candidate:hover canvas{transform:scale(1.08)}.scan-line{position:absolute;left:12%;right:12%;bottom:10px;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.4}.candidate-info{height:57px;padding:11px 14px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line)}.candidate-info b{display:block;font:16px DM Mono}.candidate-info span{font-size:9px;color:#69727c}.candidate-info svg{color:var(--accent)}.candidate-metrics{height:46px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.candidate-metrics span{font:11px DM Mono;display:flex;align-items:center;justify-content:center;gap:3px;border-right:1px solid var(--line)}.candidate-metrics span:last-child{border:0}.candidate-metrics small{font-size:8px;color:#59616a}.data-note{margin-top:15px;color:#5c6570;font:9px DM Mono;display:flex;align-items:center;gap:7px}.data-note>span{width:5px;height:5px;background:#67ce8b;border-radius:50%}.data-note b{color:#838c96}.generating{position:absolute;z-index:20;inset:170px 0 0;display:flex;flex-direction:column;align-items:center;padding-top:100px}.generating b{font-size:15px;margin-top:25px}.generating p{font-size:10px;color:#666f78}.generator-orb{width:84px;height:84px;display:grid;place-items:center;position:relative}.generator-orb .orbit-icon{transform:scale(1.8)}.generator-orb>span{position:absolute;inset:0;border:1px solid #f1a64b33;border-radius:50%;animation:pulse 1.5s ease-out infinite}.generator-orb>span:nth-child(3){animation-delay:.6s}@keyframes pulse{to{transform:scale(1.7);opacity:0}}.progress{width:220px;height:2px;background:#ffffff0b;margin-top:15px;overflow:hidden}.progress i{display:block;height:100%;width:50%;background:#f1a64b;animation:progress 1.3s ease-in-out infinite}@keyframes progress{from{transform:translateX(-100%)}to{transform:translateX(220%)}}
|
||||
.detail-view{height:calc(100vh - 78px);position:relative;overflow:hidden;background:#11151a;animation:detailIn .75s cubic-bezier(.2,.8,.2,1)}@keyframes detailIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}.detail-toolbar{height:54px;position:absolute;z-index:10;left:0;right:0;top:0;display:flex;align-items:center;padding:0 20px;border-bottom:1px solid var(--line);background:#0d1014dd;backdrop-filter:blur(14px)}.back{background:transparent;border:0;display:flex;align-items:center;gap:8px;font-size:11px;cursor:pointer}.back:hover{color:#f1a64b}.breadcrumb{margin-left:24px;padding-left:24px;border-left:1px solid var(--line);display:flex;align-items:center;gap:7px;font:9px DM Mono;color:#606974}.breadcrumb b{color:#abb2ba}.validated{margin-left:auto;color:#6dd596;background:#6dd5960e;border:1px solid #6dd59633;border-radius:20px;padding:6px 9px;font:9px DM Mono;display:flex;gap:5px;align-items:center}.detail-canvas{position:absolute;inset:0}.detail-gradient{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 46%,transparent 20%,#11151a00 43%,#11151ae5 100%),linear-gradient(90deg,#11151a 0%,transparent 18%,transparent 77%,#11151a 100%)}.model-title{position:absolute;left:30px;bottom:36px}.model-title>span{font:9px DM Mono;color:#f1a64b;letter-spacing:.18em}.model-title h2{font-size:30px;margin:6px 0 3px;letter-spacing:-.04em}.model-title h2 em{font-style:normal;color:#464e57;font-weight:400}.model-title p{margin:0;color:#68717b;font-size:9px}.part-panel{position:absolute;z-index:10;right:20px;top:74px;width:244px;background:#0c1014e8;border:1px solid var(--line);backdrop-filter:blur(16px);border-radius:12px;overflow:hidden;box-shadow:0 22px 60px #0008}.part-panel-title{height:43px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.part-panel-title>div{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:600}.part-panel-title>span{font:8px DM Mono;color:#59616a}.part-list{padding:6px}.part-list button{width:100%;height:37px;border:1px solid transparent;background:transparent;display:flex;align-items:center;gap:8px;padding:0 8px;border-radius:7px;cursor:pointer;color:#8c959e;font-size:10px}.part-list button:hover,.part-list button.active{background:#ffffff08;color:#e8ecef}.part-list button.active{border-color:#ffffff0d}.part-list button>i{width:8px;height:8px;border-radius:2px}.part-list button>span{flex:1;text-align:left}.part-list button>div{padding:5px;color:#606a74}.opacity-control{border-top:1px solid var(--line);padding:12px 13px}.opacity-control>div{display:flex;justify-content:space-between;font-size:9px;color:#7a838d}.opacity-control b{font:9px DM Mono;color:#c7cdd3}.opacity-control input{width:100%;accent-color:#f1a64b;height:3px;margin-top:11px}.isolate,.restore{margin:0 10px 8px;width:calc(100% - 20px);height:32px;border:1px solid var(--line);border-radius:7px;background:#14191e;font-size:9px;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}.restore{background:transparent;color:#68727c}.isolate:hover{border-color:#f1a64b55}.telemetry{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;border:1px solid var(--line);background:#0d1116dd;backdrop-filter:blur(12px);border-radius:10px}.telemetry>div{width:128px;height:48px;display:flex;align-items:center;gap:8px;padding:0 12px;border-right:1px solid var(--line);color:#f1a64b}.telemetry>div:last-child{border:0}.telemetry span{font-size:8px;color:#66707a}.telemetry b{display:block;color:#d8dde2;font:10px DM Mono;margin-top:2px}
|
||||
.route-layer .detail-view{height:100%}.housing-panel{position:absolute;z-index:10;right:20px;top:74px;width:244px;background:#0c1014e8;border:1px solid var(--line);backdrop-filter:blur(16px);border-radius:12px;overflow:hidden;box-shadow:0 22px 60px #0008}.housing-title{height:43px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.housing-title>div{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:600}.housing-title>span{font:8px DM Mono;color:#59616a}.housing-toggle{width:calc(100% - 20px);height:42px;margin:10px;border:1px solid var(--line);background:#12171c;border-radius:8px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;cursor:pointer}.housing-toggle span{display:flex;align-items:center;gap:8px;font-size:10px}.housing-toggle i{width:29px;height:16px;border-radius:12px;background:#303740;position:relative;transition:.3s}.housing-toggle i:after{content:'';position:absolute;width:12px;height:12px;left:2px;top:2px;background:#76808b;border-radius:50%;transition:.3s}.housing-toggle.on i{background:#f1a64b55}.housing-toggle.on i:after{left:15px;background:#f1a64b}.housing-panel p{margin:0;padding:0 13px 13px;color:#626b75;font-size:9px;line-height:1.6}.housing-panel input:disabled{opacity:.25}
|
||||
@media(max-width:1300px){.candidate-grid{grid-template-columns:repeat(2,1fr)}.candidate{height:290px}.mini-view{height:177px}}
|
||||
button:disabled { opacity: .55; cursor: not-allowed; }
|
||||
textarea { resize: none; }
|
||||
|
||||
/* Light industrial design theme */
|
||||
:root{color:#28343d;background:#dfe6e9;--line:rgba(45,67,78,.13);--muted:#73818a}
|
||||
body{background:#dfe6e9}.app-shell{background:#e6ecef}.chat-panel{background:#f7f8f7;border-color:#cfd8dc}.brand{background:#fbfbfa}.brand-mark{background:#e9f2f2;border-color:#8db6ba66}.brand b{color:#24333b}.brand span{color:#849198}.orbit-icon:after{background:#2b8d91;box-shadow:0 0 12px #2b8d9166}.orbit-icon i{border-color:#2b8d91}.chat-heading{color:#33434b;background:#f4f6f6}.chat-heading button{color:#829097}.live-dot{background:#45a77a;box-shadow:0 0 8px #45a77a66}.date-label{color:#9aa5aa}.bubble{background:#fff;border-color:#d8e0e3;color:#596870;box-shadow:0 5px 18px #40545e0b}.message.user .bubble{background:#2b8d91;border-color:#2b8d91;color:#fff}.avatar{border-color:#2b8d9155;color:#2b8d91;background:#edf6f5}.prompt-suggestions button{background:#f0f4f4;color:#718087;border-color:#d8e0e2}.prompt-suggestions button:hover{border-color:#2b8d9188;color:#217b7f}.composer{background:#fff;border-color:#d3dcdf;box-shadow:0 12px 34px #536b7615}.composer textarea{color:#35444b}.composer-foot span{color:#8b989e}.composer-foot button{background:#2b8d91;color:#fff}.composer-foot button:hover{box-shadow:0 8px 20px #2b8d9140}.workspace{background:#e6ecef}.topbar{background:#f9faf9;border-color:#ced8dc}.topbar>div:first-child span{color:#89969c}.topbar>div:first-child b{color:#304048}.source-pill{background:#f0f6f4;color:#5b7770;border-color:#cfe0da}.source-pill span{background:#46a978}.top-actions button{background:#eef2f3;color:#53636b}.account-avatar{background:#2b8d91;color:#fff;border-color:#2b8d91}.gallery{background-color:#e8edef;background-image:linear-gradient(#6d838c0c 1px,transparent 1px),linear-gradient(90deg,#6d838c0c 1px,transparent 1px)}.gallery:before{background:radial-gradient(circle at 62% 28%,#5aaeb516,transparent 39%)}.gallery-heading>div>span{color:#2b8d91}.gallery-heading h1{color:#26353d}.gallery-heading p{color:#78868d}.result-count b{color:#33434b}.result-count span{color:#8b979d}.candidate{background:#f8faf9;border-color:#ccd7db;box-shadow:0 7px 24px #62757e12}.candidate:hover{box-shadow:0 18px 45px #586d7625}.candidate-top{color:#9ba6ab}.candidate-info{background:#fbfcfb}.candidate-info b{color:#304047}.candidate-info span{color:#7d8a90}.candidate-metrics{background:#f2f6f6}.candidate-metrics span{color:#405159}.candidate-metrics small{color:#8b989e}.data-note{color:#839097}.data-note b{color:#596a72}.detail-view{background:#e8edf0}.detail-toolbar{background:#f9faf9e8;border-color:#ced8dc}.back{color:#41525a}.back:hover{color:#2b8d91}.breadcrumb{color:#8a979d}.breadcrumb b{color:#4b5d65}.validated{color:#27835e;background:#e9f6ef;border-color:#77bd9c66}.detail-gradient{background:radial-gradient(circle at 50% 46%,transparent 24%,#e8edf000 55%,#dfe7eab8 100%),linear-gradient(90deg,#e4eaed88 0%,transparent 20%,transparent 78%,#e4eaed99 100%)}.model-title>span{color:#2b8d91}.model-title h2{color:#26353d}.model-title h2 em{color:#9aa6ab}.model-title p{color:#74838a}.housing-panel{background:#fafbfaf0;border-color:#ccd7db;box-shadow:0 22px 55px #586d7628}.housing-title{color:#34464e}.housing-title>span{color:#8b989e}.housing-toggle{background:#f1f5f5;border-color:#d4dde0;color:#45575f}.housing-toggle i{background:#bac5ca}.housing-toggle.on i{background:#2b8d9140}.housing-toggle.on i:after{background:#2b8d91}.opacity-control{border-color:#d4dde0}.opacity-control>div{color:#7b898f}.opacity-control b{color:#42545c}.opacity-control input{accent-color:#2b8d91}.housing-panel p{color:#7b898f}.telemetry{background:#fafbfaf0;border-color:#ccd7db;box-shadow:0 12px 34px #536b7618}.telemetry>div{color:#2b8d91}.telemetry span{color:#7b898f}.telemetry b{color:#34464e}.generating b{color:#34464e}.generating p{color:#7c898f}.progress{background:#aebbc344}.progress i{background:#2b8d91}
|
||||
.real-asset-badge{position:absolute;right:12px;bottom:10px;z-index:3;padding:5px 8px;border:1px solid rgba(77,150,154,.24);border-radius:999px;background:rgba(248,252,251,.82);color:#397d80;font:600 9px/1 Manrope,system-ui,sans-serif;letter-spacing:.13em;backdrop-filter:blur(10px)}
|
||||
.candidate-grid{grid-template-columns:minmax(380px,540px)}
|
||||
.app-shell {
|
||||
height: 100vh;
|
||||
display: grid;
|
||||
grid-template-columns: 318px 1fr;
|
||||
background: var(--canvas);
|
||||
}
|
||||
|
||||
/* Refined industrial workspace */
|
||||
:root{--ink:#21323a;--sub:#718189;--paper:#f8faf9;--canvas:#e9eef0;--teal:#347f82;--teal-soft:#e1efed;--hair:rgba(43,66,76,.14)}
|
||||
.app-shell{grid-template-columns:318px 1fr}.chat-panel{box-shadow:12px 0 34px rgba(48,69,78,.035)}
|
||||
.brand{height:70px;padding:0 24px}.brand-mark{width:36px;height:36px;border-radius:11px}.brand b{font-size:14px}.chat-heading{height:52px;padding:0 22px}.messages{padding:22px 18px}.bubble{border-radius:5px 15px 15px 15px;line-height:1.72}.user .bubble{border-radius:15px 5px 15px 15px}.composer{margin:0 16px 18px;border-radius:16px;padding:13px}.composer-foot button{border-radius:10px}
|
||||
.topbar{height:70px;padding:0 24px}.project-id{display:flex;align-items:center;gap:14px}.topbar nav{position:absolute;left:50%;transform:translateX(-50%);height:70px;display:flex;align-items:center;gap:26px}.topbar nav span{height:70px;display:flex;align-items:center;position:relative;color:#87949a;font-size:10px;cursor:default}.topbar nav span.active{color:#31444c;font-weight:650}.topbar nav span.active:after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:#347f82}.top-actions button{border-radius:10px}.source-pill{letter-spacing:.08em}
|
||||
.route-layer,.gallery,.detail-view{height:calc(100vh - 70px)}.gallery{padding:34px 38px 24px;background-size:48px 48px}.gallery:before{inset:70px 0 0 318px}.gallery-heading{align-items:flex-start;margin-bottom:26px}.gallery-heading h1{font-size:32px;font-weight:650;margin:9px 0 7px}.gallery-heading p{font-size:11px;max-width:600px}.gallery-status{display:grid!important;grid-template-columns:auto auto;align-items:end;column-gap:9px;text-align:right}.gallery-status>span{grid-column:1/3;justify-self:end!important;padding:6px 9px;border:1px solid #83b9aa66;border-radius:999px;background:#eff7f3;color:#45816f!important;font-size:8px!important;letter-spacing:.09em!important}.gallery-status>b{font:30px DM Mono;color:#2d424b}.gallery-status>small{font-size:9px;color:#849198;padding-bottom:5px}
|
||||
.candidate-grid{display:block}.candidate{width:min(920px,calc(100vw - 400px));height:410px;display:grid;grid-template-columns:minmax(430px,1.25fr) minmax(300px,.75fr);border-radius:18px;background:rgba(250,252,251,.9);box-shadow:0 18px 55px rgba(61,80,89,.12);border-color:rgba(69,92,101,.16);overflow:hidden}.candidate:hover{transform:translateY(-5px);box-shadow:0 24px 70px rgba(54,75,84,.18)}.candidate-visual{position:relative;min-width:0;background:#e6ecee;border-right:1px solid var(--hair)}.candidate-top{height:48px;padding:16px 18px;position:absolute}.candidate-top em{display:flex;align-items:center;gap:5px;padding:5px 9px;background:rgba(244,250,248,.8);font-size:8px;letter-spacing:.06em}.mini-view{height:100%}.candidate:hover canvas{transform:scale(1.025)}.model-aura{position:absolute;inset:14% 18%;border:1px solid rgba(73,114,121,.1);border-radius:50%;pointer-events:none}.model-aura:after,.model-aura:before{content:'';position:absolute;inset:12%;border:1px solid rgba(73,114,121,.08);border-radius:50%}.model-aura:after{inset:29%}.scan-line{left:24%;right:24%;bottom:50px}.real-asset-badge{right:18px;bottom:18px}.view-caption{position:absolute;left:18px;right:18px;bottom:17px;display:flex;align-items:center;gap:7px;color:#6f8087;font-size:9px;pointer-events:none}.view-caption b{margin-left:auto;font:8px DM Mono;color:#87959b;letter-spacing:.06em}.candidate-copy{padding:32px 32px 26px;display:flex;flex-direction:column;background:rgba(251,252,251,.96)}.candidate-kicker{font:9px DM Mono;color:#347f82;letter-spacing:.12em}.candidate-copy h2{margin:15px 0 12px;font-size:27px;line-height:1.28;letter-spacing:-.04em;color:#263941}.candidate-copy>p{font-size:11px;line-height:1.75;color:#738189;margin:0}.candidate-specs{display:grid;grid-template-columns:repeat(3,1fr);margin-top:auto;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}.candidate-specs>div{padding:15px 10px 14px 0;border-right:1px solid var(--hair)}.candidate-specs>div+div{padding-left:12px}.candidate-specs>div:last-child{border:0}.candidate-specs span{display:block;font-size:8px;color:#8a979d;margin-bottom:6px}.candidate-specs b{font:17px DM Mono;color:#33474f}.candidate-specs small{display:block;font:8px Manrope;color:#819097;margin-top:3px}.open-design{height:40px;margin-top:17px;border:0;border-radius:9px;background:#347f82;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 14px;font-size:10px;font-weight:650;cursor:pointer;transition:.25s}.open-design:hover{background:#286f72;transform:translateX(2px)}.data-note{margin-top:16px}
|
||||
.detail-toolbar{height:52px;padding:0 18px}.breadcrumb{margin-left:18px;padding-left:18px}.detail-mode{position:absolute;left:50%;transform:translateX(-50%);height:52px;display:flex;align-items:center;gap:6px}.detail-mode span{padding:7px 12px;border-radius:7px;color:#87949a;font-size:9px}.detail-mode span.active{background:#e6efef;color:#347f82;font-weight:650}.detail-canvas{top:52px}.cad-grid{position:absolute;inset:0;pointer-events:none;opacity:.34;background-image:linear-gradient(rgba(72,99,109,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(72,99,109,.07) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle at 50% 45%,transparent 18%,#000 77%)}.view-tools{position:absolute;z-index:12;top:70px;left:18px;display:flex;gap:4px;padding:5px;border:1px solid var(--hair);border-radius:11px;background:rgba(250,252,251,.86);box-shadow:0 12px 28px rgba(52,72,81,.12);backdrop-filter:blur(14px)}.view-tools button{width:32px;height:32px;border:0;border-radius:7px;background:transparent;color:#75858c;display:grid;place-items:center;cursor:pointer}.view-tools button:hover,.view-tools button.active{background:#e1ecec;color:#347f82}.view-tools i{width:1px;height:22px;align-self:center;background:var(--hair);margin:0 2px}.housing-panel{top:70px;right:18px;width:252px;border-radius:14px}.housing-title{height:48px;padding:0 14px}.panel-section-label{padding:13px 14px 0;color:#8b989e;font-size:8px;letter-spacing:.08em;text-transform:uppercase}.housing-toggle{margin:9px 10px 7px}.opacity-control{padding:11px 14px 14px}.structure-label{border-top:1px solid var(--hair);padding-top:13px}.structure-list{padding:7px 10px 10px}.structure-list>div{height:34px;display:flex;align-items:center;gap:8px;padding:0 7px;border-radius:7px;color:#53666e;font-size:9px}.structure-list>div:hover{background:#edf3f3}.structure-list b{margin-left:auto;font:7px DM Mono;color:#93a0a5}.part-color{width:7px;height:7px;border-radius:2px}.part-color.motor{background:#bd7568}.part-color.gear{background:#d4b35d}.part-color.output{background:#648eae}.panel-foot{height:38px;border-top:1px solid var(--hair);display:flex;align-items:center;gap:7px;padding:0 14px;color:#718188;font-size:8px}.panel-foot .live-dot{width:5px;height:5px}.motion-control{position:absolute;z-index:12;left:18px;bottom:112px;border:1px solid var(--hair);border-radius:10px;background:rgba(250,252,251,.88);color:#43575f;height:38px;padding:0 13px;display:flex;align-items:center;gap:8px;box-shadow:0 10px 30px rgba(52,72,81,.11);backdrop-filter:blur(12px);cursor:pointer}.motion-control span{font-size:9px}.motion-control:hover{color:#347f82}.model-title{left:20px;bottom:28px}.model-title h2{font-size:28px}.telemetry{bottom:24px}.telemetry>div{width:134px;height:50px}.validated{letter-spacing:.03em}
|
||||
@media(max-width:1300px){.topbar nav{display:none}.candidate{width:100%;grid-template-columns:1.15fr .85fr}.candidate-grid{display:block}.candidate{height:390px}.mini-view{height:100%}}
|
||||
.chat-panel {
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #f8faf9;
|
||||
border-right: 1px solid #cfd9dc;
|
||||
box-shadow: 12px 0 34px rgba(48, 69, 78, .035);
|
||||
}
|
||||
|
||||
.part-visibility-toggle{width:calc(100% - 20px);height:39px;margin:0 10px 10px;padding:0 10px;border:1px solid var(--hair);border-radius:8px;background:#f5f8f7;color:#51656d;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:.2s}.part-visibility-toggle:hover,.part-visibility-toggle.selected{border-color:rgba(100,142,174,.45);background:#edf3f6}.part-visibility-toggle>span{display:flex;align-items:center;gap:7px;font-size:9px}.part-visibility-toggle>b{font:8px DM Mono;color:#86949a}.part-visibility-toggle:not(.on){opacity:.68}.part-color.cover{background:#7fa5bd}.pick-hint{margin:0 10px 12px;padding:8px 9px;border-radius:7px;background:#eef3f3;color:#718189;display:flex;align-items:flex-start;gap:7px;font-size:8px;line-height:1.45}.pick-hint svg{flex:none;color:#4d8a8d}.structure-list>div{cursor:default}.structure-list>div.active{background:#e7f0f2;color:#365b69}.structure-list button{margin-left:auto;width:25px;height:25px;border:0;border-radius:6px;background:transparent;color:#788990;display:grid;place-items:center;cursor:pointer}.structure-list button:hover{background:#dbe9ec;color:#347f82}
|
||||
.brand {
|
||||
height: 70px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 0 24px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: var(--paper);
|
||||
}
|
||||
|
||||
.message{width:100%;min-width:0}.message.user{width:100%;height:auto;min-height:0;border:0;background:transparent;border-radius:0;display:flex;place-items:initial}.message .bubble{min-width:0;max-width:248px;overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap}.message.user .bubble{width:auto;height:auto;max-width:248px;display:block}.messages{min-width:0;overflow-x:hidden}
|
||||
.part-color.rotor{background:#7897a4}
|
||||
.brand-mark {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border: 1px solid rgba(52, 127, 130, .25);
|
||||
border-radius: 11px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
color: var(--teal);
|
||||
background: #e7f1f0;
|
||||
}
|
||||
|
||||
/* Real URDF pipeline status — shown only during the first parse/assembly. */
|
||||
.manufacturing-loader{width:310px;padding:20px 21px 17px;border:1px solid rgba(73,112,120,.2);border-radius:16px;background:rgba(249,252,251,.92);box-shadow:0 22px 70px rgba(63,82,90,.18);backdrop-filter:blur(18px);color:#2f424a;display:grid;grid-template-columns:46px 1fr;column-gap:14px;white-space:nowrap;overflow:hidden}
|
||||
.manufacturing-loader.compact{width:276px;padding:16px 17px 14px;transform:scale(.86)}
|
||||
.manufacturing-mark{width:46px;height:46px;position:relative;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#e3efed,#f8fbfa);box-shadow:inset 0 0 0 1px rgba(52,127,130,.15)}
|
||||
.manufacturing-mark span{position:absolute;width:26px;height:26px;border:1.5px solid #347f82;border-radius:50%;border-right-color:transparent;animation:manufacturing-turn 1.75s cubic-bezier(.55,.15,.45,.85) infinite}
|
||||
.manufacturing-mark span:nth-child(2){width:17px;height:17px;border-color:#87aeb1 transparent #87aeb1 #87aeb1;animation-direction:reverse;animation-duration:1.15s}
|
||||
.manufacturing-mark i{width:5px;height:5px;border-radius:50%;background:#347f82;box-shadow:0 0 0 4px rgba(52,127,130,.11)}
|
||||
.manufacturing-copy{min-width:0;padding-top:1px}.manufacturing-copy small{display:block;color:#4c8a8d;font:500 8px DM Mono;letter-spacing:.14em}.manufacturing-copy b{display:block;margin-top:6px;color:#2d4149;font-size:13px;letter-spacing:.01em}.manufacturing-copy p{margin:3px 0 0;color:#7c8a90;font-size:9px;line-height:1.5}
|
||||
.manufacturing-progress{grid-column:1/3;height:3px;margin-top:16px;border-radius:999px;background:#dfe8e8;overflow:hidden}.manufacturing-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#6ea6a8,#2f8588);transition:width .28s ease}
|
||||
.manufacturing-stages{grid-column:1/3;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:11px}.manufacturing-stages span{display:flex;align-items:center;gap:5px;color:#9aa5aa;font:8px DM Mono}.manufacturing-stages span i{width:5px;height:5px;border-radius:50%;background:#c8d2d4;transition:.25s}.manufacturing-stages span.active{color:#347f82}.manufacturing-stages span.active i{background:#347f82;box-shadow:0 0 0 3px rgba(52,127,130,.11);animation:manufacturing-pulse 1.2s ease-in-out infinite}.manufacturing-stages span.done{color:#6f8987}.manufacturing-stages span.done i{background:#67a18c}
|
||||
@keyframes manufacturing-turn{to{transform:rotate(360deg)}}
|
||||
@keyframes manufacturing-pulse{50%{transform:scale(.7);opacity:.55}}
|
||||
.brand b { display: block; font-size: 14px; letter-spacing: .18em; }
|
||||
.brand span { display: block; margin-top: 3px; color: #849198; font: 9px DM Mono, monospace; letter-spacing: .18em; }
|
||||
|
||||
.chat-heading {
|
||||
height: 52px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 0 22px;
|
||||
color: #33434b;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: #f3f6f6;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.live-dot {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 50%;
|
||||
background: #45a77a;
|
||||
box-shadow: 0 0 8px rgba(69, 167, 122, .42);
|
||||
}
|
||||
|
||||
.messages {
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
padding: 22px 18px;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.message {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.message.user {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
flex: none;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
color: var(--teal);
|
||||
background: #edf6f5;
|
||||
border: 1px solid rgba(52, 127, 130, .25);
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.bubble {
|
||||
max-width: 248px;
|
||||
min-width: 0;
|
||||
padding: 11px 13px;
|
||||
color: #596870;
|
||||
background: #fff;
|
||||
border: 1px solid #d8e0e3;
|
||||
border-radius: 5px 15px 15px 15px;
|
||||
box-shadow: 0 5px 18px rgba(64, 84, 94, .05);
|
||||
font-size: 12px;
|
||||
line-height: 1.72;
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: anywhere;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.bubble.error {
|
||||
color: #963d3d;
|
||||
background: #fff4f4;
|
||||
border-color: #e2b7b7;
|
||||
}
|
||||
|
||||
.message.user .bubble {
|
||||
color: #fff;
|
||||
background: var(--teal);
|
||||
border-color: var(--teal);
|
||||
border-radius: 15px 5px 15px 15px;
|
||||
font-weight: 650;
|
||||
}
|
||||
|
||||
.prompt-suggestions {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
padding: 0 17px 9px;
|
||||
}
|
||||
|
||||
.prompt-suggestions button {
|
||||
border: 1px solid #d8e0e2;
|
||||
background: #f0f4f4;
|
||||
color: #718087;
|
||||
border-radius: 20px;
|
||||
padding: 6px 10px;
|
||||
font-size: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.composer {
|
||||
margin: 0 16px 18px;
|
||||
padding: 13px;
|
||||
background: #fff;
|
||||
border: 1px solid #d3dcdf;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 12px 34px rgba(83, 107, 118, .08);
|
||||
}
|
||||
|
||||
.composer:focus-within { border-color: rgba(52, 127, 130, .48); }
|
||||
.composer textarea { width: 100%; height: 72px; border: 0; outline: 0; background: transparent; color: #35444b; font-size: 12px; line-height: 1.5; }
|
||||
.composer-foot { display: flex; align-items: center; justify-content: space-between; }
|
||||
.composer-foot span { display: flex; align-items: center; gap: 5px; color: #8b989e; font-size: 9px; }
|
||||
.composer-foot button { width: 30px; height: 30px; border: 0; border-radius: 10px; background: var(--teal); color: #fff; display: grid; place-items: center; cursor: pointer; }
|
||||
|
||||
.workspace {
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.topbar {
|
||||
height: 70px;
|
||||
flex: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24px;
|
||||
background: var(--paper);
|
||||
border-bottom: 1px solid #ced8dc;
|
||||
}
|
||||
|
||||
.project-id { display: flex; align-items: center; gap: 14px; }
|
||||
.project-id span { color: #89969c; font: 9px DM Mono, monospace; letter-spacing: .15em; }
|
||||
.project-id b { color: #304048; font-size: 13px; }
|
||||
.top-actions { display: flex; align-items: center; gap: 10px; }
|
||||
.top-actions button, .account-avatar { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 10px; background: #eef2f3; color: #53636b; display: grid; place-items: center; }
|
||||
.account-avatar { color: #fff; background: var(--teal); border-color: var(--teal); }
|
||||
|
||||
.workspace-body {
|
||||
min-height: 0;
|
||||
flex: 1;
|
||||
display: grid;
|
||||
grid-template-columns: 360px 1fr;
|
||||
gap: 18px;
|
||||
padding: 22px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dashboard {
|
||||
min-height: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14px;
|
||||
overflow: auto;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.panel, .summary-panel, .detail-panel {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: rgba(251, 252, 251, .92);
|
||||
box-shadow: 0 16px 42px rgba(61, 80, 89, .1);
|
||||
}
|
||||
|
||||
.summary-panel {
|
||||
padding: 18px;
|
||||
}
|
||||
|
||||
.summary-head, .panel-head, .detail-head, .artifact-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.summary-head strong, .panel-head strong, .detail-head strong, .artifact-head strong {
|
||||
font-size: 13px;
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.summary-head span, .panel-head span, .panel-head small, .detail-head span {
|
||||
min-width: 0;
|
||||
color: #7c8a90;
|
||||
font: 9px DM Mono, monospace;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.summary-metrics {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
margin-top: 16px;
|
||||
border-top: 1px solid var(--line);
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.summary-metrics div, .detail-foot div {
|
||||
padding: 13px 10px 12px 0;
|
||||
border-right: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.summary-metrics div:last-child, .detail-foot div:last-child { border-right: 0; }
|
||||
.summary-metrics span, .detail-foot span, .detail-grid span { display: block; color: #849198; font-size: 9px; margin-bottom: 6px; }
|
||||
.summary-metrics b, .detail-foot b, .detail-grid b { display: block; color: #33474f; font: 13px DM Mono, monospace; overflow-wrap: anywhere; }
|
||||
|
||||
.notice {
|
||||
margin-top: 14px;
|
||||
padding: 10px 11px;
|
||||
border-radius: 7px;
|
||||
background: #eef5f5;
|
||||
color: #4d6b72;
|
||||
font-size: 11px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.panel {
|
||||
padding: 14px;
|
||||
}
|
||||
|
||||
.panel-head {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.panel-head > div {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.panel-head button, .artifact-head button {
|
||||
height: 28px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
padding: 0 9px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
background: #f1f5f5;
|
||||
color: #51656d;
|
||||
font-size: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.generator-form {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.kind-switch {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.kind-switch button {
|
||||
min-width: 0;
|
||||
height: 66px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: #f4f7f7;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.kind-switch button.active {
|
||||
border-color: rgba(52, 127, 130, .42);
|
||||
background: #e8f3f2;
|
||||
}
|
||||
|
||||
.kind-switch b { display: block; font-size: 11px; }
|
||||
.kind-switch span { display: block; margin-top: 6px; color: #7e8b91; font-size: 9px; line-height: 1.35; }
|
||||
|
||||
.generator-form label {
|
||||
display: grid;
|
||||
gap: 7px;
|
||||
}
|
||||
|
||||
.generator-form label > span {
|
||||
color: #7d8a90;
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.generator-form textarea, .generator-form select {
|
||||
width: 100%;
|
||||
border: 1px solid #d3dcdf;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
color: #35444b;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.generator-form textarea {
|
||||
height: 92px;
|
||||
padding: 10px;
|
||||
line-height: 1.55;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.generator-form select {
|
||||
height: 36px;
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.generate-button {
|
||||
height: 38px;
|
||||
border: 0;
|
||||
border-radius: 8px;
|
||||
color: #fff;
|
||||
background: var(--teal);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 7px;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.task-list {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.task-row {
|
||||
min-width: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 11px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: #f7f9f8;
|
||||
color: #405159;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.task-row.active {
|
||||
border-color: rgba(52, 127, 130, .46);
|
||||
background: #eaf4f3;
|
||||
}
|
||||
|
||||
.task-row-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.task-row-top span, .task-row small {
|
||||
color: #849198;
|
||||
font: 9px DM Mono, monospace;
|
||||
}
|
||||
|
||||
.task-row b {
|
||||
display: block;
|
||||
margin-bottom: 7px;
|
||||
color: #30444c;
|
||||
font-size: 11px;
|
||||
line-height: 1.45;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.task-row-top em, .detail-head em {
|
||||
flex: none;
|
||||
padding: 4px 7px;
|
||||
border-radius: 999px;
|
||||
background: #eef2f3;
|
||||
color: #718087;
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.is-success { color: var(--green) !important; background: #e8f5ee !important; }
|
||||
.is-running { color: var(--amber) !important; background: #fff4e5 !important; }
|
||||
.is-error { color: var(--red) !important; background: #fff0f0 !important; }
|
||||
|
||||
.empty-state {
|
||||
padding: 18px;
|
||||
border: 1px dashed #cbd7da;
|
||||
border-radius: 8px;
|
||||
color: #87949a;
|
||||
text-align: center;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.detail-panel {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
padding: 18px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.detail-empty {
|
||||
height: 100%;
|
||||
min-height: 420px;
|
||||
display: grid;
|
||||
place-content: center;
|
||||
justify-items: center;
|
||||
gap: 10px;
|
||||
color: #7c8a90;
|
||||
}
|
||||
|
||||
.detail-head {
|
||||
padding-bottom: 16px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.detail-head > div {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.detail-head strong {
|
||||
display: block;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .04em;
|
||||
}
|
||||
|
||||
.detail-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 12px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.detail-grid > div {
|
||||
min-width: 0;
|
||||
padding: 13px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: #f7f9f8;
|
||||
}
|
||||
|
||||
.error-box {
|
||||
margin-top: 14px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: flex-start;
|
||||
padding: 11px;
|
||||
border: 1px solid #e1b3b3;
|
||||
border-radius: 8px;
|
||||
background: #fff5f5;
|
||||
color: var(--red);
|
||||
font-size: 11px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.artifact-head {
|
||||
margin-top: 22px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.detail-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.artifact-list {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.artifact-list a {
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
padding: 12px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: #f7f9f8;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.artifact-list a:hover {
|
||||
border-color: rgba(52, 127, 130, .42);
|
||||
background: #eaf4f3;
|
||||
}
|
||||
|
||||
.artifact-list a div {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.artifact-list b {
|
||||
display: block;
|
||||
color: #30444c;
|
||||
font-size: 12px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.artifact-list small {
|
||||
display: block;
|
||||
margin-top: 5px;
|
||||
color: #7e8c92;
|
||||
font: 9px DM Mono, monospace;
|
||||
}
|
||||
|
||||
.detail-foot {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
margin-top: 18px;
|
||||
border-top: 1px solid var(--line);
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.parameter-editor {
|
||||
margin-top: 18px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.parameter-editor > strong {
|
||||
display: block;
|
||||
color: #53666e;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.parameter-editor > div {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 7px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.parameter-editor label {
|
||||
min-width: 0;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 88px 44px;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 8px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
background: #f7f9f8;
|
||||
}
|
||||
|
||||
.parameter-editor label > span {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #718087;
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.parameter-editor input {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
height: 28px;
|
||||
padding: 0 7px;
|
||||
border: 1px solid #d3dcdf;
|
||||
border-radius: 6px;
|
||||
outline: 0;
|
||||
background: #fff;
|
||||
color: #33474f;
|
||||
font: 10px DM Mono, monospace;
|
||||
}
|
||||
|
||||
.parameter-editor input:focus {
|
||||
border-color: rgba(52, 127, 130, .5);
|
||||
}
|
||||
|
||||
.parameter-editor button {
|
||||
width: 44px;
|
||||
height: 28px;
|
||||
padding: 0;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: #eef4f3;
|
||||
color: #46666c;
|
||||
cursor: pointer;
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.parameter-editor button:hover {
|
||||
border-color: rgba(52, 127, 130, .42);
|
||||
background: #eaf4f3;
|
||||
}
|
||||
|
||||
.spin {
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
body { min-width: 1020px; }
|
||||
.app-shell { grid-template-columns: 300px 1fr; }
|
||||
.workspace-body { grid-template-columns: 330px 1fr; gap: 14px; padding: 16px; }
|
||||
}
|
||||
|
||||
+16
-4
@@ -1,13 +1,25 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
const backendHost = process.env.BACKEND_HOST || '127.0.0.1'
|
||||
const backendPort = process.env.BACKEND_PORT || '8000'
|
||||
const agentHost = process.env.AGENT_HOST || '127.0.0.1'
|
||||
const agentPort = process.env.AGENT_PORT || '8010'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
server: {
|
||||
host: '127.0.0.1',
|
||||
port: 5173,
|
||||
host: process.env.FRONTEND_HOST || '127.0.0.1',
|
||||
port: Number(process.env.FRONTEND_PORT || 5173),
|
||||
strictPort: true,
|
||||
proxy: {
|
||||
'/api': 'http://127.0.0.1:8000',
|
||||
'/project-assets': 'http://127.0.0.1:8000',
|
||||
'/api/chat': `http://${agentHost}:${agentPort}`,
|
||||
'/api/config': `http://${agentHost}:${agentPort}`,
|
||||
'/api/project-summary': `http://${backendHost}:${backendPort}`,
|
||||
'/api/generate': `http://${backendHost}:${backendPort}`,
|
||||
'/api/tasks': `http://${backendHost}:${backendPort}`,
|
||||
'/api/upload': `http://${backendHost}:${backendPort}`,
|
||||
'/project-assets': `http://${backendHost}:${backendPort}`,
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user