YaroslavKartashov
/
MAI
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(ui): make config blocks use space

Browse Source
main
AlexsandrSnytkin 17 hours ago
parent 637ae5ce87
commit 465d1bb6bb
2 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File

1
tests/test_ui_server.py
Unescape Escape View File

@ -90,6 +90,7 @@ class UIServerTests(unittest.TestCase):
self.assertNotIn('block-actions', HTML) self.assertNotIn('block-actions', HTML)
self.assertNotIn('block-resize', HTML) self.assertNotIn('block-resize', HTML)
self.assertIn('config-block-deleted', HTML) self.assertIn('config-block-deleted', HTML)
self.assertNotIn('⠿', HTML)
self.assertIn('Compact form layer', HTML) self.assertIn('Compact form layer', HTML)
self.assertIn('prefers-reduced-motion', HTML) self.assertIn('prefers-reduced-motion', HTML)
self.assertIn('color-mix', HTML) self.assertIn('color-mix', HTML)

15
ui_server.py
Unescape Escape View File

@ -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-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-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 { 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; } .block-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.config-block > summary { cursor: grab; touch-action: none; } .config-block > summary { cursor: grab; touch-action: none; }
.config-block > summary:active, .config-block.is-dragging > summary { cursor: grabbing; } .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, .config-block.is-resizing { user-select: none; }
.config-block.is-dragging { cursor: grabbing; } .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-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 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; } .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) { @container config-block (max-width: 620px) {
.config-block.settings-group { grid-template-columns: 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; } .config-block.settings-group > summary { grid-column: 1 / -1; }
.config-block .advanced-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .config-block .advanced-grid { grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); }
.config-block .packet-grid { grid-template-columns: repeat(2, minmax(0, 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 { grid-template-columns: 54px minmax(0, 1fr) 66px 28px; }
.config-block .packet-field-row .packet-role { grid-column: 2 / -1; } .config-block .packet-field-row .packet-role { grid-column: 2 / -1; }
} }
@ -1449,7 +1452,7 @@ HTML = """<!doctype html>
<span class="config-toolbar-title">Блоки конфигурации</span> <span class="config-toolbar-title">Блоки конфигурации</span>
<button id="configResetLayout" type="button">сбросить раскладку</button> <button id="configResetLayout" type="button">сбросить раскладку</button>
<button id="configRestoreToggle" type="button" aria-expanded="false">структура</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>
<div id="configWorkspace" class="config-workspace"> <div id="configWorkspace" class="config-workspace">
<div id="configRestorePanel" class="config-restore-panel" hidden> <div id="configRestorePanel" class="config-restore-panel" hidden>

Write Preview
Loading…
Cancel
Save