hamcha/strimertul
1
0
Fork 0
mirror of https://git.sr.ht/~ashkeel/strimertul synced 2024-09-18 01:50:50 +00:00
Code Activity Actions

Add horizontal support to Field

Browse source
This commit is contained in:
Ash Keel 2021-11-05 18:43:33 +01:00
parent 3577dc7142
commit f4a30dddb5
No known key found for this signature in database
GPG key ID: BAD8D93E7314ED3E
1 changed files with 21 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
frontend/src/ui/components/Field.tsx
View file

@ -2,12 +2,30 @@ import React from 'react';
export interface FieldProps {
name?: string;
className?: string;
horizontal?: boolean;
}
function Field({ name, children }: React.PropsWithChildren<FieldProps>) {
function Field({
name,
className,
horizontal,
children,
}: React.PropsWithChildren<FieldProps>) {
let classes = className ?? '';
if (horizontal) {
classes += ' is-horizontal';
}
let nameEl = null;
if (name) {
nameEl = <label className="label">{name}</label>;
if (horizontal) {
nameEl = <div className="field-label is-normal">{nameEl}</div>;
}
}
return (
<div className="field">
{name ? <label className="label">{name}</label> : null}
<div className={`field ${classes}`}>
{nameEl}
{children}
</div>
);