Add heading level configuration to horizontal scroller

src/back/jdd-components/horizontal-gallery/horizontal-gallery.css

@@ -7,10 +7,14 @@
 		gap: 16px;
 		width: 100%;
 		margin-bottom: 16px;
+		align-items: center;
 
-		h2 {
-			font-size: 32px;
-			line-height: 48px;
+		h1,
+		h2,
+		h3,
+		h4,
+		h5,
+		h6 {
 			font-family: var(--font-headings);
 			text-align: center;
 			color: var(--color-brand-text-fg);
@@ -18,9 +22,8 @@
 			margin-top: 0;
 			margin-bottom: 0;
 
-			@container (max-width: 600px) {
-				font-size: 28px;
-				line-height: 34px;
+			&[data-align="left"] {
+				text-align: left;
 			}
 		}
 
@@ -46,6 +49,12 @@
 			}
 		}
 
+		&:has([data-align="left"]) {
+			&::before {
+				display: none;
+			}
+		}
+
 		button {
 			border: none;
 			background: none;
@@ -74,6 +83,7 @@
 			max-height: min(75vh, 700px);
 			grid-template-rows: 1fr min-content;
 			height: 100%;
+			min-width: 80px;
 		}
 
 		&,

src/back/jdd-components/horizontal-gallery/horizontal-gallery.jdd.tsx

@@ -12,6 +12,8 @@ import { PathFilePointer } from "@sealcode/file-manager";
 
 const component_arguments = {
 	title: new ComponentArguments.ShortText(),
+	heading_level: new ComponentArguments.Enum(["h1", "h2", "h3", "h4", "h5", "h6"]),
+	heading_align: new ComponentArguments.Enum(["left", "center"]),
 	images: new ComponentArguments.List(
 		new ComponentArguments.Structured({
 			image: new ComponentArguments.Image(),
@@ -34,7 +36,7 @@ export class HorizontalGallery extends Component<typeof component_arguments> {
 	}
 
 	toHTML({
-		args: { title, images },
+		args: { title, images, heading_level, heading_align },
 		classes,
 		jdd_context: { render_image },
 		index,
@@ -72,7 +74,7 @@ export class HorizontalGallery extends Component<typeof component_arguments> {
 					render: async ({ scroller, markers }) => (
 						<div>
 							<div class="horizontal-gallery__top-bar">
-								<h2>{insert_nbsp(title)}</h2>
+								{`<${heading_level} data-align="${heading_align}">${insert_nbsp(title)}</${heading_level}>`}
 								<div class="horizontal-gallery__buttons">
 									<button
 										class="prev-button"