e20de2166c
- "app/src/api/engine.ts" - "app/src/embed.tsx" - "app/vite.embed.config.ts" - "app/tsconfig.node.json" GSD-Task: S03/T01
2 lines
No EOL
18 KiB
CSS
2 lines
No EOL
18 KiB
CSS
._container_1ywxc_3{box-sizing:border-box;gap:24px;min-height:calc(100svh - 80px);padding:24px;display:flex}._leftPanel_1ywxc_11{flex-direction:column;flex:0 0 340px;gap:20px;display:flex}._rightPanel_1ywxc_18{border:1px solid var(--border);background:var(--code-bg);border-radius:8px;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:400px;padding:16px;display:flex}._previewPlaceholder_1ywxc_31{color:var(--text);text-align:center;opacity:.7;font-size:15px}@media (width<=768px){._container_1ywxc_3{flex-direction:column;padding:16px}._leftPanel_1ywxc_11{flex:none;width:100%}}._container_16ibx_3{flex-direction:column;width:100%;height:100svh;display:flex;overflow:hidden}._toolbar_16ibx_11{border-bottom:1px solid var(--border);background:var(--bg);flex-shrink:0;justify-content:space-between;align-items:center;gap:16px;padding:8px 16px;display:flex}._toolGroup_16ibx_22{gap:4px;display:flex}._mainArea_16ibx_27{flex:1;min-height:0;display:flex}._canvasArea_16ibx_33{background:var(--code-bg);flex:1;min-width:0;position:relative;overflow:hidden}._panelArea_16ibx_41{border-left:1px solid var(--border);background:var(--bg);flex:0 0 260px;padding:12px;overflow-y:auto}._panelPlaceholder_16ibx_49{height:100%;color:var(--text);opacity:.6;justify-content:center;align-items:center;font-size:14px;display:flex}@media (width<=768px){._mainArea_16ibx_27{flex-direction:column}._panelArea_16ibx_41{border-left:none;border-top:1px solid var(--border);flex:none;height:200px}}._container_1clu0_3{flex-direction:column;width:100%;height:100svh;display:flex;overflow:hidden}._header_1clu0_11{border-bottom:1px solid var(--border);background:var(--bg);flex-shrink:0;justify-content:space-between;align-items:center;gap:16px;padding:12px 16px;display:flex}._headerTitle_1clu0_22{color:var(--text-h);margin:0;font-size:18px;font-weight:700}._backBtn_1clu0_29{border:1px solid var(--border);background:var(--bg);color:var(--text-h);cursor:pointer;border-radius:5px;align-items:center;gap:6px;padding:6px 12px;font-family:inherit;font-size:13px;transition:border-color .12s,background-color .12s;display:inline-flex}._backBtn_1clu0_29:hover{border-color:var(--accent-border);background:var(--accent-bg)}._body_1clu0_49{flex:1;min-height:0;display:flex;overflow-y:auto}._mainPanel_1clu0_56{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;min-width:0;padding:32px 24px;display:flex}._sidePanel_1clu0_67{border-left:1px solid var(--border);background:var(--bg);flex-direction:column;flex:0 0 320px;gap:20px;padding:16px;display:flex;overflow-y:auto}._previewSection_1clu0_79{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:480px;display:flex}._previewLabel_1clu0_88{text-transform:uppercase;letter-spacing:.5px;color:var(--text);align-self:flex-start;font-size:12px;font-weight:600}._previewImage_1clu0_97{border:1px solid var(--border);background:var(--code-bg);object-fit:contain;border-radius:8px;max-width:100%;max-height:340px}._previewPlaceholder_1clu0_106{border:1px dashed var(--border);width:100%;height:200px;color:var(--text);border-radius:8px;justify-content:center;align-items:center;font-size:14px;display:flex}._sectionLabel_1clu0_119{text-transform:uppercase;letter-spacing:.5px;color:var(--text);margin:0 0 8px;font-size:12px;font-weight:700}._formatGrid_1clu0_128{flex-direction:column;gap:6px;display:flex}._formatCard_1clu0_134{border:1px solid var(--border);background:var(--bg);cursor:pointer;text-align:left;border-radius:6px;flex-direction:column;gap:2px;padding:10px 12px;font-family:inherit;transition:border-color .12s,background-color .12s;display:flex}._formatCard_1clu0_134:hover{border-color:var(--accent-border);background:var(--accent-bg)}._formatCardSelected_1clu0_153{border-color:var(--accent);background:var(--accent-bg);box-shadow:0 0 0 1px var(--accent)}._formatName_1clu0_159{color:var(--text-h);font-size:14px;font-weight:600}._formatDesc_1clu0_165{color:var(--text);font-size:12px;line-height:1.3}._unitSelector_1clu0_172{align-items:center;gap:16px;display:flex}._unitLabel_1clu0_178{color:var(--text-h);cursor:pointer;align-items:center;gap:4px;font-size:13px;display:flex}._unitLabel_1clu0_178 input[type=radio]{accent-color:var(--accent)}._validationPanel_1clu0_192{flex-direction:column;gap:6px;display:flex}._validationItem_1clu0_198{border-radius:6px;align-items:flex-start;gap:8px;padding:8px 10px;font-size:13px;line-height:1.4;display:flex}._validationError_1clu0_208{color:#e74c3c;background:#e74c3c1a;border:1px solid #e74c3c40}._validationWarning_1clu0_214{color:#e67e22;background:#f39c121a;border:1px solid #f39c1240}._validationIcon_1clu0_220{flex-shrink:0;font-size:14px;line-height:1.4}._validationOk_1clu0_226{color:#27ae60;padding:8px 10px;font-size:13px}._downloadBtn_1clu0_233{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px 24px;font-family:inherit;font-size:15px;font-weight:600;transition:opacity .15s;display:flex}._downloadBtn_1clu0_233:hover{opacity:.9}._downloadBtn_1clu0_233:disabled{opacity:.5;cursor:not-allowed}._downloadBtnExporting_1clu0_260{opacity:.7;cursor:wait}._exportError_1clu0_265{color:#e74c3c;background:#e74c3c14;border-radius:6px;padding:8px 10px;font-size:13px}@media (width<=768px){._body_1clu0_49{flex-direction:column}._sidePanel_1clu0_67{border-left:none;border-top:1px solid var(--border);flex:none}}@font-face{font-family:Roboto;src:url(/fonts/Roboto-Regular.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Open Sans;src:url(/fonts/OpenSans-Regular.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Lato;src:url(/fonts/Lato-Regular.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}.file-upload-zone{border:2px dashed var(--border);text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;padding:24px 16px;transition:border-color .15s,background-color .15s}.file-upload-zone:hover,.file-upload-zone--drag-over{border-color:var(--accent);background:var(--accent-bg)}.file-upload-zone:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.file-upload-prompt{flex-direction:column;align-items:center;gap:6px;display:flex}.file-upload-icon{font-size:28px}.file-upload-prompt p{color:var(--text-h);margin:0;font-size:15px}.file-upload-prompt small{color:var(--text);font-size:13px}.file-upload-preview{align-items:center;gap:12px;display:flex}.file-upload-thumb{object-fit:cover;border:1px solid var(--border);border-radius:4px;width:56px;height:56px}.file-upload-info{text-align:left;flex-direction:column;align-items:flex-start;gap:2px;display:flex}.file-upload-name{color:var(--text-h);word-break:break-all;font-size:14px;font-weight:500}.file-upload-size{color:var(--text);font-size:13px}.file-upload-badge{text-transform:uppercase;letter-spacing:.5px;color:var(--accent);background:var(--accent-bg);border-radius:3px;padding:2px 6px;font-size:11px;font-weight:600}.preset-selector{flex-direction:column;gap:8px;display:flex}.preset-heading{color:var(--text-h);text-transform:uppercase;letter-spacing:.5px;margin:0;font-size:14px;font-weight:600}.preset-loading,.preset-error{color:var(--text);margin:0;font-size:14px}.preset-error{color:#e74c3c}.preset-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.preset-card{border:1px solid var(--border);background:var(--bg);cursor:pointer;text-align:left;border-radius:6px;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;font-family:inherit;transition:border-color .12s,background-color .12s;display:flex}.preset-card:hover{border-color:var(--accent-border);background:var(--accent-bg)}.preset-card--selected{border-color:var(--accent);background:var(--accent-bg);box-shadow:0 0 0 1px var(--accent)}.preset-card-name{color:var(--text-h);text-transform:capitalize;font-size:14px;font-weight:600}.preset-card-desc{color:var(--text);font-size:12px;line-height:1.3}.parameter-sliders{flex-direction:column;gap:12px;display:flex}.parameter-heading{color:var(--text-h);text-transform:uppercase;letter-spacing:.5px;margin:0;font-size:14px;font-weight:600}.slider-row{grid-template-columns:120px 1fr 48px;align-items:center;gap:8px;display:grid}.slider-label{color:var(--text-h);white-space:nowrap;font-size:13px}.slider-input{cursor:pointer;width:100%;height:4px;accent-color:var(--accent)}.slider-value{color:var(--accent);text-align:right;font-variant-numeric:tabular-nums;font-size:13px;font-weight:500}.svg-preview{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;min-height:300px;display:flex}.svg-preview--loading{gap:12px}.svg-preview-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.svg-preview-status{color:var(--text);margin:0;font-size:14px}.svg-preview--error{gap:4px}.svg-preview-error{color:#e74c3c;margin:0;font-size:14px}.svg-preview-hint{color:var(--text);margin:0;font-size:13px}.svg-preview--empty{opacity:.7}.svg-preview-placeholder{color:var(--text);text-align:center;margin:0;font-size:15px}.svg-preview--ready{justify-content:flex-start;gap:12px}.svg-preview-container{width:100%;max-height:70vh;overflow:auto}.svg-preview-container svg{width:100%;height:auto;display:block}.svg-preview-meta{color:var(--text);border-top:1px solid var(--border);gap:16px;width:100%;padding:6px 0;font-size:12px;display:flex}.svg-preview-warnings{color:#e67e22}.use-this-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;gap:6px;padding:12px 24px;font-family:inherit;font-size:15px;font-weight:600;transition:opacity .15s;display:flex}.use-this-btn:hover{opacity:.9}.use-this-btn:disabled{opacity:.5;cursor:not-allowed}.output-info-bar{background:var(--code-bg);border:1px solid var(--border);border-radius:6px;flex-direction:column;gap:6px;padding:10px 12px;font-size:13px;display:flex}.output-info-bar--empty{opacity:.6}.output-info-placeholder{color:var(--text);font-size:13px}.output-info-stats{flex-wrap:wrap;gap:16px;display:flex}.output-stat{flex-direction:column;align-items:flex-start;gap:1px;display:flex}.output-stat-label{text-transform:uppercase;letter-spacing:.5px;color:var(--text);font-size:11px;font-weight:600}.output-stat-value{font-variant-numeric:tabular-nums;font-size:15px;font-weight:600}.output-stat--green .output-stat-value{color:#27ae60}.output-stat--yellow .output-stat-value{color:#f39c12}.output-stat--red .output-stat-value{color:#e74c3c}.output-info-warnings{flex-direction:column;gap:2px;display:flex}.output-info-warning{color:#e67e22;font-size:12px}.placeholder-view{min-height:60vh;color:var(--text);justify-content:center;align-items:center;font-size:20px;display:flex}.canvas-tool-btn{border:1px solid var(--border);background:var(--bg);color:var(--text-h);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:5px;align-items:center;gap:4px;padding:6px 10px;font-family:inherit;font-size:13px;transition:border-color .12s,background-color .12s;display:inline-flex}.canvas-tool-btn:hover{border-color:var(--accent-border);background:var(--accent-bg)}.canvas-tool-btn--active{border-color:var(--accent);background:var(--accent-bg);color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.canvas-tool-btn:disabled{opacity:.4;cursor:not-allowed}.canvas-tool-icon{font-size:16px;line-height:1}.canvas-tool-label{font-size:12px}#app:has([data-testid=canvas-container]){max-width:100%}.artboard-setup-overlay{justify-content:center;align-items:center;min-height:80vh;padding:24px;display:flex}.artboard-setup-modal{border:1px solid var(--border);background:var(--bg);width:100%;max-width:480px;box-shadow:var(--shadow);border-radius:12px;flex-direction:column;gap:16px;padding:24px;display:flex}.artboard-setup-modal h2{margin:0 0 4px}.artboard-setup-shapes{border:none;margin:0;padding:0}.artboard-setup-shapes legend{color:var(--text-h);margin-bottom:8px;font-size:14px;font-weight:600}.artboard-shape-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px;display:grid}.artboard-shape-btn{border:1px solid var(--border);background:var(--bg);color:var(--text-h);cursor:pointer;border-radius:6px;padding:8px 10px;font-family:inherit;font-size:13px;transition:border-color .12s,background-color .12s}.artboard-shape-btn:hover{border-color:var(--accent-border);background:var(--accent-bg)}.artboard-shape-btn.active{border-color:var(--accent);background:var(--accent-bg);color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.artboard-setup-dimensions{gap:12px;display:flex}.artboard-setup-dimensions label{color:var(--text-h);flex-direction:column;flex:1;gap:4px;font-size:13px;font-weight:500;display:flex}.artboard-setup-dimensions input{border:1px solid var(--border);background:var(--bg);color:var(--text-h);border-radius:4px;padding:6px 8px;font-family:inherit;font-size:14px}.artboard-setup-dimensions input:disabled{opacity:.5}.artboard-setup-units{border:none;align-items:center;gap:16px;margin:0;padding:0;display:flex}.artboard-setup-units legend{color:var(--text-h);margin-right:8px;font-size:14px;font-weight:600}.artboard-setup-units label{color:var(--text-h);cursor:pointer;align-items:center;gap:4px;font-size:13px;display:flex}.artboard-setup-confirm{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;padding:10px 20px;font-family:inherit;font-size:14px;font-weight:600;transition:opacity .15s;display:flex}.artboard-setup-confirm:hover{opacity:.9}.canvas-toolbar{flex-wrap:wrap;align-items:center;gap:12px;width:100%;display:flex}.canvas-toolbar-group{align-items:center;gap:4px;display:flex}.canvas-toolbar-zoom-label{color:var(--text-h);text-align:center;font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;min-width:42px;font-size:12px;font-weight:600}.object-panel{flex-direction:column;gap:0;display:flex}.object-panel-header{text-transform:uppercase;letter-spacing:.5px;color:var(--text);border-bottom:1px solid var(--border);padding:8px 0 6px;font-size:12px;font-weight:700}.object-panel-empty{color:var(--text);opacity:.6;text-align:center;padding:12px 0;font-size:13px}.object-panel-list{flex-direction:column;display:flex}.object-panel-row{border-bottom:1px solid var(--border);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-h);align-items:center;gap:6px;padding:6px 4px;font-size:13px;transition:background-color .1s;display:flex}.object-panel-row:hover{background:var(--accent-bg)}.object-panel-row--selected{background:var(--accent-bg);border-left:2px solid var(--accent);padding-left:2px}.object-panel-row--hidden{opacity:.4}.object-panel-drag{cursor:grab;color:var(--text);text-align:center;flex-shrink:0;width:16px;font-size:14px}.object-panel-type-icon{text-align:center;flex-shrink:0;width:18px;font-size:14px}.object-panel-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.object-panel-name-input{border:1px solid var(--accent);background:var(--bg);min-width:0;color:var(--text-h);border-radius:3px;outline:none;flex:1;padding:2px 4px;font-family:inherit;font-size:13px}.object-panel-icon-btn{cursor:pointer;background:0 0;border:none;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-size:14px;transition:background-color .1s;display:inline-flex}.object-panel-icon-btn:hover{background:var(--accent-bg)}.object-panel-icon-btn--off{opacity:.35}.object-panel-icon-btn--on{color:var(--accent)}.alignment-bar{border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:8px;padding:8px 0;display:flex}.alignment-bar-group{gap:2px;display:flex}.alignment-btn{border:1px solid var(--border);background:var(--bg);cursor:pointer;width:28px;height:28px;color:var(--text-h);border-radius:4px;justify-content:center;align-items:center;padding:0;font-size:14px;transition:border-color .1s,background-color .1s;display:inline-flex}.alignment-btn:hover{border-color:var(--accent-border);background:var(--accent-bg)}.alignment-btn:active{background:var(--accent-bg);border-color:var(--accent)}.shape-properties{border-top:1px solid var(--border);flex-direction:column;gap:0;padding-top:8px;display:flex}.shape-properties-header{text-transform:uppercase;letter-spacing:.5px;color:var(--text);padding:0 0 6px;font-size:12px;font-weight:700}.shape-prop-section{border-bottom:1px solid var(--border);flex-direction:column;gap:4px;padding:6px 0;display:flex}.shape-prop-section:last-child{border-bottom:none}.shape-prop-label{text-transform:uppercase;letter-spacing:.3px;color:var(--text);font-size:11px;font-weight:600}.shape-prop-dims{font-variant-numeric:tabular-nums;color:var(--text-h);gap:16px;font-size:13px;display:flex}.shape-prop-color-input{border:1px solid var(--border);cursor:pointer;background:var(--bg);border-radius:4px;width:100%;height:28px;padding:2px}.shape-prop-number-input{border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text-h);border-radius:4px;padding:4px 6px;font-family:inherit;font-size:13px}.shape-prop-fill-row{align-items:center;gap:8px;display:flex}.shape-prop-fill-row .shape-prop-color-input{flex:1}.shape-prop-fill-toggle{color:var(--text-h);cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;align-items:center;gap:4px;font-size:12px;display:flex}.shape-prop-select{border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text-h);cursor:pointer;border-radius:4px;padding:4px 6px;font-family:inherit;font-size:13px}.shape-prop-range-input{width:100%;accent-color:var(--accent)}.shape-prop-range-value{color:var(--accent);font-variant-numeric:tabular-nums;font-size:12px;font-weight:600}
|
|
/*$vite$:1*/ |