calvin.erfmann/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-01-28 22:00:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

💄 adjust form style for createblueprintform

Browse Source
This commit is contained in:
Fred KISSIE
2025-10-25 03:22:51 +02:00
parent f5dbc18c05
commit a05ee2483b
2 changed files with 31 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/CreateBlueprintForm.tsx
View File

@@ -69,13 +69,17 @@ export default function CreateBlueprintForm({
),
defaultValues: {
name: "",
contents: `proxy-resources:
resource-nice-id-uno:
name: this is my resource
protocol: http
full-domain: never-gonna-give-you-up.example.com
host-header: example.com
tls-server-name: example.com
contents: `# Example blueprint
# proxy-resources:
# resource-nice-id-uno:
# name: this is my resource
# protocol: http
# full-domain: never-gonna-give-you-up.example.com
# targets:
# - site: lively-yosemite-toad
# hostname: localhost
# method: http
# port: 8000
`
}
});
@@ -125,7 +129,7 @@ export default function CreateBlueprintForm({
</SettingsSectionTitle>
</SettingsSectionHeader>
<SettingsSectionBody>
<SettingsSectionForm>
<SettingsSectionForm className="max-w-2xl">
<FormField
control={form.control}
name="name"
@@ -159,7 +163,7 @@ export default function CreateBlueprintForm({
<FormControl>
<div
className={cn(
"resize-y h-52 min-h-52 overflow-y-auto overflow-x-clip max-w-full"
"resize-y h-64 min-h-64 overflow-y-auto overflow-x-clip max-w-full rounded-md"
)}
>
<Editor

22
src/components/Settings.tsx
View File

@@ -1,9 +1,15 @@
import { cn } from "@app/lib/cn";
export function SettingsContainer({ children }: { children: React.ReactNode }) {
return <div className="space-y-6">{children}</div>;
}
export function SettingsSection({ children }: { children: React.ReactNode }) {
return <div className="border rounded-lg bg-card p-5 flex flex-col min-h-[200px]">{children}</div>;
return (
<div className="border rounded-lg bg-card p-5 flex flex-col min-h-[200px]">
{children}
</div>
);
}
export function SettingsSectionHeader({
@@ -15,11 +21,15 @@ export function SettingsSectionHeader({
}
export function SettingsSectionForm({
children
children,
className
}: {
children: React.ReactNode;
className?: string;
}) {
return <div className="max-w-xl space-y-4">{children}</div>;
return (
<div className={cn("max-w-xl space-y-4", className)}>{children}</div>
);
}
export function SettingsSectionTitle({
@@ -55,7 +65,11 @@ export function SettingsSectionFooter({
}: {
children: React.ReactNode;
}) {
return <div className="flex justify-end space-x-2 mt-auto pt-6">{children}</div>;
return (
<div className="flex justify-end space-x-2 mt-auto pt-6">
{children}
</div>
);
}
export function SettingsSectionGrid({