First cut of the link fields

assets/css/main.css

@@ -2,6 +2,14 @@ html {
     font-family: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir,
         "Nimbus Sans L", Roboto, "Noto Sans", "Segoe UI", Arial, Helvetica,
         "Helvetica Neue", sans-serif;
+    font-size: 1.1em;
+}
+
+/**
+ * Basic styling
+ */
+input, select, textarea {
+    padding: 4px;
 }
 
 body.role-site {
@@ -44,15 +52,52 @@ div.post {
     border-bottom: solid thin grey;
 }
 
-
+/**
+ * Post form
+ */
 
 form.post-form {
-    display: flex;
+    display: grid;
+    grid-template-columns: auto 23vw;
+    grid-template-rows: auto 2.5em;
+    gap: 6px;
+
     flex-direction: column;
     height: 100%;
 }
 
+form.post-form input[type='text'] {
+    margin-bottom: 6px;
+}
+
+form.post-form div.main-area {
+    grid-column-start: 1;
+    grid-column-end: 2;
+    grid-row-start: 1;
+    grid-row-end: 2;
+
+    display: flex;
+    flex-direction: column;
+}
+
+div.right-area div.section {
+    margin-bottom: 24px;
+}
+
+div.right-area div.section input {
+    width: 100%;
+}
+
+div.right-area div.section div.section-heading {
+    margin-bottom: 8px;
+}
+
 form.post-form textarea {
+    width: 100%;
+    min-height: 4vh;
+}
+
+form.post-form textarea[name="body"] {
     flex-grow: 1;
     flex-shrink: 1;
 }