Watch
0
0
Fork
You've already forked hyperhive
0

fixup! swarm-ui: forms share one submit flow, result line and field column

This commit is contained in:
iris 2026-11-06 18:54:34 +01:00 • committed by mara
commit 4bd81d5b0f
2 changed files with 4 additions and 17 deletions

View file

@ -1,12 +1,7 @@
.ui-form-stack {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.75em;
margin-top: 1em;
}
.ui-form-stack-start {
align-items: flex-start;
}
.ui-form-stack-stretch {
align-items: stretch;
}

View file

@ -1,25 +1,17 @@
// <FormStack> — a `<form>` whose fields and buttons stack in one column, with
// the gap the forms in dialogs and panels share. The fields keep their own
// width (`align="start"`) or fill the form (`align="stretch"`).
// <FormStack> — a `<form>` whose fields and buttons stack in one column, each
// keeping its own width, with the gap the forms in dialogs and panels share.
import type { ComponentChildren } from "preact";
import "./FormStack.css";
export function FormStack({
onSubmit,
align = "start",
class: extraClass,
children,
}: {
onSubmit: (e: Event) => void;
align?: "start" | "stretch";
class?: string;
children: ComponentChildren;
}) {
const classes = ["ui-form-stack", `ui-form-stack-${align}`, extraClass]
.filter(Boolean)
.join(" ");
return (
<form class={classes} onSubmit={onSubmit}>
<form class="ui-form-stack" onSubmit={onSubmit}>
{children}
</form>
);