Merge branch 'develop-minor' into v5/develop

getkirby · Dec 6, 2024 · 704497e · 704497e
2 parents 249c269 + c8af3cb
commit 704497e
Showing 1 changed file with 14 additions and 7 deletions.
diff --git a/panel/src/components/Forms/Blocks/Types/Gallery.vue b/panel/src/components/Forms/Blocks/Types/Gallery.vue
@@ -1,13 +1,17 @@
 <template>
-	<figure :data-empty="isEmpty" :style="{ '--block-back': back }">
+	<figure
+		:data-empty="isEmpty"
+		:style="{ '--block-back': back }"
+		class="k-block-type-gallery-figure"
+	>
 		<ul @dblclick="open">
 			<template v-if="isEmpty">
 				<li
 					v-for="index in 3"
 					:key="index"
 					class="k-block-type-gallery-placeholder"
 				>
-					<k-image-frame :ratio="ratio" />
+					<k-image-frame :ratio="ratio" class="k-block-type-gallery-frame" />
 				</li>
 			</template>
 			<template v-else>
@@ -18,6 +22,7 @@
 						:src="image.url"
 						:srcset="image.image.srcset"
 						:alt="image.alt"
+						class="k-block-type-gallery-frame"
 					/>
 				</li>
 
@@ -80,26 +85,28 @@ export default {
 .k-block-container.k-block-container-type-gallery {
 	padding: 0;
 }
-.k-block-type-gallery > figure {
+.k-block-type-gallery-figure {
 	padding: var(--spacing-3);
 	border-radius: var(--rounded);
 }
-.k-block-type-gallery > figure:not([data-empty="true"]) {
+.k-block-type-gallery-figure:not([data-empty="true"]) {
 	background: var(--block-back);
 }
 
-.k-block-type-gallery ul {
+.k-block-type-gallery-figure ul {
 	display: grid;
 	grid-gap: 0.75rem;
 	grid-template-columns: repeat(auto-fit, minmax(6rem, 1fr));
 	line-height: 0;
 	align-items: center;
 	justify-content: center;
 }
-.k-block-type-gallery:not([data-disabled="true"]) ul {
+.k-block-type-gallery:not([data-disabled="true"])
+	.k-block-type-gallery-figure
+	ul {
 	cursor: pointer;
 }
-.k-block-type-gallery ul .k-image-frame {
+.k-block-type-gallery-frame {
 	border-radius: var(--rounded-sm);
 }