mirror/web
1
0
Fork 0
mirror of https://github.com/meshtastic/web.git synced 2026-04-23 15:27:38 -04:00
Code Issues Packages Projects Releases Wiki Activity

fix: improve-responsiveness

Browse Source
This commit is contained in:
Dan Ditomaso
2025-04-12 12:46:01 -04:00
parent b52ed19649
commit 1867484032
1 changed files with 9 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/Form/FormWrapper.tsx
View File

@@ -20,17 +20,16 @@ export const FieldWrapper = ({
}: FieldWrapperProps) => (
<div className="pt-6 sm:pt-5">
<fieldset aria-labelledby="label-notifications">
<div className="sm:grid sm:grid-cols-3 sm:items-baseline sm:gap-4">
{/* first column = labels/heading, second column = fields, third column = gutter */}
<div className="grid md:grid-cols-[1fr_2fr] lg:grid-cols-[1fr_2fr_1fr] sm:items-baseline gap-4">
<Label htmlFor={fieldName}>{label}</Label>
<div className="sm:col-span-2">
<div className="max-w-lg">
<p className="text-sm text-slate-500">{description}</p>
<p hidden={valid ?? true} className="text-sm text-red-500">
{validationText}
</p>
<div className="mt-4 space-y-4">
<div className="flex items-center">{children}</div>
</div>
<div className="max-w-3xl">
<p className="text-sm text-slate-500">{description}</p>
<p hidden={valid ?? true} className="text-sm text-red-500">
{validationText}
</p>
<div className="mt-4 space-y-4 sm:col-span-2">
<div className="flex items-center">{children}</div>
</div>
</div>
</div>