Showing all unique descriptions on profile with network logo. Fixed Fame Digital scraper.

assets/components/actors/actor.vue

@@ -243,10 +243,33 @@
 					@click="expanded = true"
 				><Icon icon="arrow-down3" /></span>
 
-				<p
-					v-if="actor.description"
-					class="description"
-				>{{ actor.description }}</p>
+				<div class="descriptions-container">
+					<div
+						v-if="actor.descriptions && actor.descriptions.length > 0"
+						class="descriptions"
+					>
+						<p
+							v-for="description in actor.descriptions"
+							:key="`description-${description.network.id}`"
+							class="description"
+						>
+							{{ description.text }}
+							<router-link :to="{ name: 'network', params: { networkSlug: description.network.slug } }">
+								<img
+									v-if="description.site"
+									:src="`/img/logos/${description.network.slug}/${description.site.slug}.png`"
+									class="description-logo"
+								>
+
+								<img
+									v-else
+									:src="`/img/logos/${description.network.slug}/network.png`"
+									class="description-logo"
+								>
+							</router-link>
+						</p>
+					</div>
+				</div>
 
 				<Social
 					v-if="actor.social && actor.social.length > 0"
@@ -540,17 +563,28 @@ export default {
     font-size: .8rem;
 }
 
-.description {
+.descriptions-container {
     max-width: 30rem;
-    max-height: 12rem;
+    max-height: 100%;
     position: relative;
     display: block;
     flex-grow: 1;
     box-sizing: border-box;
-    margin: 0 2rem 0 0;
-    line-height: 1.5;
-    text-overflow: ellipsis;
-    font-size: .9rem;
+	overflow: hidden;
+
+	&::after {
+		content: '';
+		width: 100%;
+		height: 1.5rem;
+		position: absolute;
+		bottom: 0;
+		background: linear-gradient(transparent, 25%, var(--profile) 75%);
+		pointer-events: none;
+	}
+}
+
+.descriptions {
+	height: 100%;
     overflow: auto;
     scrollbar-width: none;
 
@@ -559,6 +593,22 @@ export default {
     }
 }
 
+.description {
+	margin: 0;
+	padding: 0 2rem 0 0;
+    line-height: 1.5;
+    font-size: .9rem;
+}
+
+.description-logo {
+	display: block;
+	width: 15rem;
+	max-height: 2rem;
+	margin: .5rem 0 1.5rem 0;
+	object-fit: contain;
+	object-position: 0 50%;
+}
+
 .actor-content {
     display: flex;
     flex-grow: 1;