fix pub create form styling

src/app/publication/create/page.tsx

@@ -29,7 +29,7 @@ export default async function Page() {
 				<CreateContainerDescription>
 					Create a new entry for a publication i.e. a place you intend to submit to.
 				</CreateContainerDescription>
-				<PubForm genres={genres} createPub={createPub} />
+				<PubForm genres={genres} createPub={createPub} className="mt-6" />
 			</CreateContainerContent>
 		</CreateContainer>
 	)

src/app/publication/loading.tsx

@@ -0,0 +1,5 @@
+import { LoadingSpinner } from "app/loading";
+
+export default function Loading() {
+  return <LoadingSpinner />
+}

src/app/submission/loading.tsx

@@ -0,0 +1,5 @@
+import { LoadingSpinner } from "app/loading";
+
+export default function Loading() {
+  return <LoadingSpinner />
+}

src/app/ui/forms/pub.tsx

@@ -23,6 +23,8 @@ import {
 import GenresTrigger from "./genresTrigger"
 import GenreCheckbox from "./genreCheckbox"
 import { randomPublicationTitle } from "app/lib/shortStoryTitleGenerator"
+import { ComponentProps } from "react"
+import { Genre } from "@prisma/client"
 
 const formSchema = z.object({
 	title: z.string().min(2).max(50),
@@ -31,7 +33,7 @@ const formSchema = z.object({
 	genres: z.array(z.number()),
 })
 
-export default function PubForm({ genres, createPub }) {
+export default function PubForm({ genres, createPub, className }: ComponentProps<"div"> & { genres: Array<Genre>, createPub: (data: any) => void }) {
 	const form = useForm<z.infer<typeof formSchema>>({
 		resolver: zodResolver(formSchema),
 		defaultValues: {
@@ -75,6 +77,7 @@ export default function PubForm({ genres, createPub }) {
 			.toLowerCase() +
 		".com"
 	return (
+		<div className={className}>
 			<Form {...form}>
 				<form onSubmit={form.handleSubmit(onSubmit, onErrors)} className="space-y-8">
 					<FormField
@@ -154,6 +157,7 @@ export default function PubForm({ genres, createPub }) {
 					<Button type="submit">Submit</Button>
 				</form>
 			</Form>
+		</div>
 
 	)
 }