|
|
|
|
@ -1314,20 +1314,23 @@ HTML = """<!doctype html>
|
|
|
|
|
.config-canvas > .config-block.is-dragging, .config-canvas > .config-block.is-resizing { z-index: 5; border-color: var(--ui-accent) !important; box-shadow: 0 10px 28px color-mix(in srgb, var(--ui-accent) 16%, transparent); transition: none; }
|
|
|
|
|
.config-canvas > .config-custom-block { border-style: dashed !important; }
|
|
|
|
|
.config-block > summary { position: sticky; top: 0; z-index: 2; background: var(--ui-panel); }
|
|
|
|
|
.config-block > summary::after { content: '⠿' !important; color: var(--ui-accent); font-size: 16px; line-height: 1; transform: none !important; }
|
|
|
|
|
.config-block > summary::after { display: none !important; }
|
|
|
|
|
.block-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
|
|
|
.config-block > summary { cursor: grab; touch-action: none; }
|
|
|
|
|
.config-block > summary:active, .config-block.is-dragging > summary { cursor: grabbing; }
|
|
|
|
|
.config-block.is-dragging, .config-block.is-resizing { user-select: none; }
|
|
|
|
|
.config-block.is-dragging { cursor: grabbing; }
|
|
|
|
|
.config-block input, .config-block select, .config-block textarea, .config-block button, .config-block a { cursor: auto; touch-action: auto; }
|
|
|
|
|
.config-canvas > .config-block.settings-group { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); align-content: start; }
|
|
|
|
|
.config-block .advanced-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); align-content: start; }
|
|
|
|
|
.config-block .packet-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); align-content: start; }
|
|
|
|
|
.config-block label, .config-block input, .config-block select, .config-block button, .config-block pre { min-width: 0; max-width: 100%; box-sizing: border-box; }
|
|
|
|
|
.config-block .control-fields, .config-block .advanced-grid, .config-block .packet-grid, .config-block .packet-field-list { min-width: 0; }
|
|
|
|
|
@container config-block (max-width: 620px) {
|
|
|
|
|
.config-block.settings-group { grid-template-columns: minmax(0, 1fr); }
|
|
|
|
|
.config-block.settings-group > summary { grid-column: 1; }
|
|
|
|
|
.config-block .advanced-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
|
|
|
.config-block .packet-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
|
|
|
.config-canvas > .config-block.settings-group { grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); }
|
|
|
|
|
.config-block.settings-group > summary { grid-column: 1 / -1; }
|
|
|
|
|
.config-block .advanced-grid { grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); }
|
|
|
|
|
.config-block .packet-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
|
|
|
|
|
.config-block .packet-field-row { grid-template-columns: 54px minmax(0, 1fr) 66px 28px; }
|
|
|
|
|
.config-block .packet-field-row .packet-role { grid-column: 2 / -1; }
|
|
|
|
|
}
|
|
|
|
|
@ -1449,7 +1452,7 @@ HTML = """<!doctype html>
|
|
|
|
|
<span class="config-toolbar-title">Блоки конфигурации</span>
|
|
|
|
|
<button id="configResetLayout" type="button">сбросить раскладку</button>
|
|
|
|
|
<button id="configRestoreToggle" type="button" aria-expanded="false">структура</button>
|
|
|
|
|
<span id="configLayoutState" class="config-layout-state">перетаскивайте блоки за ⠿</span>
|
|
|
|
|
<span id="configLayoutState" class="config-layout-state">перетаскивайте за заголовок или свободное место</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="configWorkspace" class="config-workspace">
|
|
|
|
|
<div id="configRestorePanel" class="config-restore-panel" hidden>
|
|
|
|
|
|