diff --git a/python-tools/static/style.css b/python-tools/static/style.css index f373021..e4e3523 100644 --- a/python-tools/static/style.css +++ b/python-tools/static/style.css @@ -61,15 +61,18 @@ a { align-items: end; display: grid; gap: .75rem; - grid-template-columns: repeat(5, minmax(0, 1fr)) auto; + grid-template-columns: minmax(20rem, 1fr) auto; min-width: 0; } -.task-input { - margin: 0; +.task-options { + display: grid; + gap: .75rem; min-width: 0; } +.task-input { margin: 0; } + .task-input label, .task-input fieldset label { display: block; @@ -110,22 +113,31 @@ button { } .task-action { - align-items: stretch; - border-left: 1px solid color-mix(in srgb, currentColor 15%, transparent); - display: flex; - gap: .4rem; - grid-column: -1; - grid-row: 1; - margin-left: .25rem; - padding-left: .75rem; + justify-self: end; } -.task-action select, -.task-action button { +.split-button { + display: inline-flex; +} + +.split-button select, +.split-button button, +.task-action > button { margin: 0; white-space: nowrap; } +.split-button select { + border-bottom-right-radius: 0; + border-right: 0; + border-top-right-radius: 0; +} + +.split-button button { + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} + .visually-hidden { height: 1px; margin: -1px; @@ -179,11 +191,11 @@ button:disabled { @media (max-width: 42rem) { .task-form { - grid-template-columns: minmax(0, 1fr) auto; + grid-template-columns: 1fr; } .task-action { - grid-column: 2; + justify-self: start; } } diff --git a/python-tools/templates/index.html b/python-tools/templates/index.html index 4ba6944..d919028 100644 --- a/python-tools/templates/index.html +++ b/python-tools/templates/index.html @@ -40,6 +40,7 @@
diff --git a/python-tools/tests/test_web.py b/python-tools/tests/test_web.py index c8d0e28..d1e47d2 100644 --- a/python-tools/tests/test_web.py +++ b/python-tools/tests/test_web.py @@ -231,6 +231,7 @@ print(Path(os.environ["SERVER_MAINTENANCE_INPUT"]).read_text()) assert b"Report only" in page.data assert b"Apply changes" in page.data assert b"data-execution-mode" in page.data + assert b'class="split-button"' in page.data response = client.post("/tasks/examples/migrate.py/run") run_id = int(response.headers["Location"].rsplit("/", 1)[1]) deadline = time.monotonic() + 3