Static CMS v2.0 (#226)

- [x] Update auf Static CMS v2.0
- [x] aktualisierte Shortcodes (schließt #225)
- [x] aktualisierte Previews (schließt #181)
- Ordnerunterstützung
- [x] vervollständigte Seiten
- [x] Aufräumarbeiten

Reviewed-on: https://git.cantorgymnasium.de/gcg/gcg-website/pulls/226

static/admin/shortcodes/components/card.js

@@ -0,0 +1,12 @@
+const Card = (child, opts = { vertical: false }) =>
+	h(
+		"span",
+		{
+			className:
+				"relative flex border border-slate-400 focus-within:border-blue-800 dark:focus-within:border-blue-100 focus-within:bg-slate-100 dark:focus-within:bg-slate-800 hover:bg-slate-100 dark:hover:bg-slate-800 pb-3 cursor-text group/active" +
+				(opts.vertical ? " flex-col" : ""),
+		},
+		child
+	);
+
+export default Card;

static/admin/shortcodes/components/image.js

@@ -0,0 +1,41 @@
+const Image = ({ label, assetSource, handleOpenMediaLibrary }) =>
+	h(
+		"span",
+		{ className: "flex flex-col w-full" },
+		h(
+			"label",
+			{
+				className:
+					"w-full flex text-xs font-bold dark:font-semibold group-focus-within/active:text-blue-500 group-hover/active:text-blue-500 cursor-text text-slate-500 dark:text-slate-400 px-3 pt-3",
+			},
+			label
+		),
+		h(
+			"span",
+			{ className: "flex flex-col gap-2 px-3 pt-2" },
+			h(
+				"span",
+				{},
+				h("img", {
+					role: "presentation",
+					src: assetSource,
+					className: "object-cover max-w-full overflow-hidden",
+				})
+			),
+			h(
+				"span",
+				{ className: "flex gap-2" },
+				h(
+					"button",
+					{
+						type: "button",
+						onClick: handleOpenMediaLibrary,
+						className: "btn btn-contained-primary",
+					},
+					"Bild auswählen"
+				)
+			)
+		)
+	);
+
+export default Image;

static/admin/shortcodes/components/index.js

@@ -0,0 +1,5 @@
+import Card from "./card.js";
+import TextField from "./text-field.js";
+import Image from "./image.js";
+
+export { Card, TextField, Image };

static/admin/shortcodes/components/text-field.js

@@ -0,0 +1,21 @@
+const TextField = ({ label, value, onChange }) =>
+	h(
+		"span",
+		{ key: "text-" + label, className: "flex flex-col w-full" },
+		h(
+			"label",
+			{
+				className:
+					"w-full flex text-xs font-bold dark:font-semibold group-focus-within/active:text-blue-500 group-hover/active:text-blue-500 cursor-text text-slate-500 dark:text-slate-400 px-3 pt-3",
+			},
+			label
+		),
+		h("input", {
+			className:
+				"MuiInout-Input w-full h-6 px-3 bg-transparent outline-none text-sm font-medium text-gray-900 dark:text-gray-100 cursor-default",
+			value,
+			onChange,
+		})
+	);
+
+export default TextField;