Added tag actor editing.

pages/scene/+Page.vue

@@ -140,26 +140,30 @@
 					</li>
 				</ul>
 
-				<div
-					v-for="actorTags in tags"
-					:key="`tags-${actorTags.actor?.name || 'scene'}`"
-				>
-					<ul class="tags nolist">
-						<li
-							v-if="actorTags.actor"
-							class="tags-actor"
-						>{{ actorTags.actor.name }}:</li>
+				<div class="tags">
+					<div
+						v-for="(actorTags, index) in tags"
+						:key="`tags-${actorTags.actor?.slug || 'scene'}`"
+						class="tags-section"
+						:class="{ space: index > 1 }"
+					>
+						<ul class="nolist">
+							<li
+								v-if="actorTags.actor"
+								class="tags-actor"
+							>{{ actorTags.actor.name }}:</li>
 
-						<li
-							v-for="tag in actorTags.tags"
-							:key="`tag-${tag.id}`"
-						>
-							<Link
-								:href="`/tag/${tag.slug}`"
-								class="tag nolink"
-							>{{ tag.name }}</Link>
-						</li>
-					</ul>
+							<li
+								v-for="tag in actorTags.tags"
+								:key="`tag-${tag.id}`"
+							>
+								<Link
+									:href="`/tag/${tag.slug}`"
+									class="tag nolink"
+								>{{ tag.name }}</Link>
+							</li>
+						</ul>
+					</div>
 				</div>
 
 				<div
@@ -658,6 +662,20 @@ function copySummary() {
 	margin-bottom: 1rem;
 }
 
+.tags {
+	display: flex;
+	flex-wrap: wrap;
+	gap: .25rem;
+}
+
+.tags-section {
+	display: inline-flex;
+
+	&.space {
+		margin-left: .5rem;
+	}
+}
+
 .tags-actor {
 	margin-right: .5rem;
 	font-weight: bold;

pages/scene/edit/+Page.vue

@@ -261,6 +261,7 @@ const fields = computed(() => [
 		key: 'tags',
 		type: 'tags',
 		value: scene.value.tags.toSorted((tagA, tagB) => tagA.name.localeCompare(tagB.name)),
+		simplify: false,
 	},
 	{
 		key: 'movies',