33 lines
3.7 KiB
CSS
33 lines
3.7 KiB
CSS
.landing-white .drawing-popup { box-sizing: border-box; width: min(900px, calc(100vw - 32px)); max-height: 88dvh; margin: auto; padding: 28px; overflow: auto; border: 1px solid #d3e4ef; border-radius: 22px; background: #fbfdff; color: #14263d; box-shadow: 0 24px 90px #183c652b; color-scheme: light; }
|
|
.landing-white .drawing-popup::backdrop { background: #203a5754; backdrop-filter: blur(6px); }
|
|
.drawing-popup-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
|
|
.drawing-popup-head span { color: #087fcb; font-size: 10px; font-weight: 700; letter-spacing: .18em; }
|
|
.drawing-popup h2 { margin: 6px 0 0; font-size: 25px; letter-spacing: -.04em; }
|
|
.drawing-popup h3 { margin: 0 0 10px; font-size: 14px; }
|
|
.drawing-popup button { padding: 10px 15px; border-radius: 9px; border: 1px solid #cddfec; background: #fff; color: #28516d; cursor: pointer; font: inherit; font-size: 12px; transition: background .15s, border-color .15s; }
|
|
.drawing-popup button:hover { background: #edf7ff; border-color: #087fcb; }
|
|
.drawing-popup button:disabled { opacity: .5; cursor: default; }
|
|
.drawing-popup button:focus-visible, .drawing-popup input:focus-visible { outline: 2px solid #087fcb; outline-offset: 3px; }
|
|
.drawing-popup .drawing-primary { color: #fff; background: #087fcb; border-color: #087fcb; }
|
|
.drawing-popup .drawing-primary:hover { background: #076ba9; }
|
|
.drawing-popup .drawing-popup-close { font-size: 24px; line-height: 1; padding: 8px 12px; }
|
|
.drawing-popup-intro { color: #64748b; font-size: 13px; line-height: 1.8; margin: 18px 0 22px; }
|
|
.drawing-folder-label { display: block; font-size: 12px; font-weight: 700; margin-bottom: 8px; }
|
|
.drawing-folder-row { display: flex; gap: 8px; }
|
|
.drawing-folder-row input { flex: 1; min-width: 0; padding: 11px 12px; border: 1px solid #cddfec; border-radius: 9px; color: #14263d; background: #fff; font: inherit; font-size: 12px; }
|
|
.drawing-run-row { display: flex; align-items: center; gap: 14px; margin: 16px 0; }
|
|
#drawing-status { font-size: 12px; color: #47718f; line-height: 1.7; overflow-wrap: anywhere; }
|
|
#drawing-status[data-state=error] { color: #ae352b; }
|
|
#drawing-progress { width: 100%; height: 5px; accent-color: #087fcb; margin-bottom: 15px; }
|
|
.drawing-log-section { padding: 16px; border: 1px solid #dce8f1; border-radius: 12px; background: #f1f6fa; }
|
|
#drawing-logs { height: 155px; overflow: auto; margin: 0; font: 11px/1.9 Consolas, 'Malgun Gothic', monospace; color: #426079; white-space: pre-wrap; overflow-wrap: anywhere; }
|
|
#drawing-results { margin-top: 20px; }
|
|
#drawing-result-note, #drawing-output-path { font-size: 11px; color: #64748b; line-height: 1.7; overflow-wrap: anywhere; }
|
|
.drawing-book { display: grid; grid-template-columns: 1fr auto; gap: 7px 16px; border: 1px solid #d5e5f0; border-radius: 12px; padding: 14px; margin-top: 10px; background: #fff; }
|
|
.drawing-book strong { font-size: 13px; overflow-wrap: anywhere; }
|
|
.drawing-book > span { font-size: 11px; color: #7b6a35; grid-column: 1; }
|
|
.drawing-book-actions { display: flex; gap: 7px; grid-column: 2; grid-row: 1 / 3; align-items: center; }
|
|
.drawing-popup-foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 20px; margin-top: 22px; border-top: 1px solid #e0e9f1; }
|
|
.drawing-popup-foot span { font-size: 11px; line-height: 1.6; color: #718399; }
|
|
@media(max-width: 600px) { .landing-white .drawing-popup { padding: 19px; width: calc(100vw - 20px); max-height: 92dvh; border-radius: 16px; } .drawing-popup h2 { font-size: 21px; } .drawing-run-row { flex-direction: column; align-items: flex-start; gap: 8px; } .drawing-book { grid-template-columns: 1fr; } .drawing-book-actions { grid-column: 1; grid-row: auto; } #drawing-logs { height: 130px; } }
|