Experimenting using GraphQL in favor of REST.

assets/components/tile/actor.vue

@@ -35,9 +35,9 @@
 
                     <span
                         v-if="actor.ageThen && actor.ageThen < actor.age"
-                        v-tooltip="'Age at scene date'"
+                        v-tooltip="`${actor.ageThen} years old on release date`"
                         class="age-then"
-                    >@ {{ actor.ageThen }}</span>
+                    >{{ actor.ageThen }}</span>
                 </span>
                 <span
                     v-if="actor.origin"
@@ -114,6 +114,7 @@ export default {
     color: $text-contrast;
     width: 100%;
     display: flex;
+    align-items: center;
     justify-content: space-between;
     box-sizing: border-box;
     padding: .5rem;

assets/components/tile/release.vue

@@ -1,5 +1,8 @@
 <template>
-    <div class="tile">
+    <div
+        class="tile"
+        :class="{ movie: release.type === 'movie' }"
+    >
         <span class="banner">
             <span class="details">
                 <router-link
@@ -39,7 +42,7 @@
             </span>
 
             <router-link
-                :to="`/scene/${release.id}`"
+                :to="`/${release.type || 'scene'}/${release.id}`"
                 class="link"
             >
                 <img
@@ -66,14 +69,19 @@
 
         <div class="info">
             <router-link
-                :to="`/scene/${release.id}`"
+                :to="`/${release.type || 'scene'}/${release.id}`"
                 class="row link"
             >
                 <h3
                     v-tooltip.top="release.title"
                     :title="release.title"
                     class="title"
-                >{{ release.title }}</h3>
+                >
+                    <Icon
+                        v-if="release.type === 'movie'"
+                        icon="film"
+                    />{{ release.title }}
+                </h3>
             </router-link>
 
             <span class="row">
@@ -212,13 +220,19 @@ export default {
 }
 
 .title {
-    color: $text;
+    display: flex;
+    align-items: center;
     margin: 0 .25rem .25rem 0;
+    color: $text;
     font-size: 1rem;
     max-height: 3rem;
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
+
+    .icon {
+        margin: 0 .25rem 0 0;
+    }
 }
 
 .network {