Updated actor photos to use expand and load events with scroll component. Fixed actor description independent entity logo. Fixed unwanted actor horizontal scroll.

assets/components/actors/actor.vue

@@ -254,7 +254,7 @@
 							{{ description.text }}
 							<router-link :to="`/${description.entity.type}/${description.entity.slug}`">
 								<img
-									v-if="description.entity.type === 'network'"
+									v-if="description.entity.type === 'network' || description.entity.independent"
 									:src="`/img/logos/${description.entity.slug}/thumbs/network.png`"
 									class="description-logo"
 								>
@@ -285,16 +285,14 @@
 			<div class="actor-content">
 				<Scroll
 					v-if="actor.avatar || (actor.photos && actor.photos.length > 0)"
+					:expanded="expanded"
 					class="scroll-light"
+					@expand="(state) => expanded = state"
 				>
-					<Photos :actor="actor" />
+					<Photos
-
+						:actor="actor"
-					<template v-slot:expanded>
+						:class="{ expanded }"
-						<Photos
+					/>
-							class="expanded"
-							:actor="actor"
-						/>
-					</template>
 				</Scroll>
 
 				<FilterBar
@@ -426,14 +424,6 @@ export default {
     margin: 0 1rem 0 0;
 }
 
-.actor-inner {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    padding: 0;
-    overflow-x: auto;
-}
-
 .profile {
     background: var(--profile);
     color: var(--highlight-extreme);

assets/components/actors/photos.vue

@@ -20,6 +20,7 @@
 				:data-loading="sfw ? `/img/${actor.avatar.sfw.lazy}` : `/media/${actor.avatar.lazy}`"
 				:title="actor.avatar.copyright && `© ${actor.avatar.copyright}`"
 				class="avatar photo"
+				@load="$parent.$emit('load')"
 			>
 		</a>
 
@@ -37,6 +38,7 @@
 				:data-loading="sfw ? `/img/${photo.sfw.lazy}` : `/media/${photo.lazy}`"
 				:title="`© ${photo.copyright || photo.entity.name}`"
 				class="photo"
+				@load="$parent.$emit('load')"
 			>
 		</a>
 	</div>
@@ -67,6 +69,7 @@ export default {
     display: flex;
 	box-sizing: border-box;
 	padding: .5rem 1rem;
+	margin: 0 1rem 0 0;
     font-size: 0;
 	overflow-x: scroll;
 	scroll-behavior: smooth;
@@ -75,12 +78,7 @@ export default {
 	&.expanded {
 		flex-wrap: wrap;
 		justify-content: center;
-
+		margin: 0;
-		/*
-		display: grid;
-		grid-gap: .5rem;
-		grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
-		*/
 
 		.photo-link {
 			margin: 0 .5rem .5rem 0;

assets/js/actors/actions.js

@@ -88,7 +88,7 @@ function initActorActions(store, router) {
 							comment
 						}
 					}
-					profiles: actorsProfiles {
+					profiles: actorsProfiles(orderBy: PRIORITY_DESC) {
 						description
 						descriptionHash
 						entity {
@@ -96,6 +96,7 @@ function initActorActions(store, router) {
 							name
 							slug
 							type
+							independent
 							parent {
 								id
 								name