Redesigned release page. Added 'single site' marker, linking directly to network page. Fixed Dogfart scraper duration.

assets/components/tile/actor.vue

@@ -0,0 +1,40 @@
+<template>
+    <div
+        v-if="actor"
+        class="actor"
+    >
+        <a
+            :href="`/actor/${actor.slug}`"
+            class="name"
+        >{{ actor.name }}</a>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        actor: {
+            type: Object,
+            default: null,
+        },
+    },
+};
+</script>
+
+<style lang="scss" scoped>
+@import 'theme';
+
+.actor {
+    background: $background;
+    display: inline-block;
+    margin: 0 .25rem .25rem 0;
+    box-shadow: 0 0 3px $shadow-weak;
+}
+
+.name {
+    color: $link;
+    display: inline-block;
+    padding: .5rem;
+    text-decoration: none;
+}
+</style>

assets/components/tile/release.vue

@@ -3,6 +3,13 @@
         <span class="banner">
             <span class="details">
                 <a
+                    v-if="release.site.independent"
+                    :href="`/network/${release.network.slug}`"
+                    class="site site-link"
+                >{{ release.network.name }}</a>
+
+                <a
+                    v-else
                     v-tooltip.bottom="`Part of ${release.network.name}`"
                     :title="`Part of ${release.network.name}`"
                     :href="`/site/${release.site.slug}`"
@@ -120,9 +127,8 @@ export default {
     flex-direction: column;
     box-sizing: border-box;
     padding: 0 0 .5rem 0;
-    border-radius: .25rem;
     overflow: hidden;
-    box-shadow: 0 0 3px rgba(0, 0, 0, .25);
+    box-shadow: 0 0 3px $shadow-weak;
     height: 100%;
 }
 
@@ -151,7 +157,7 @@ export default {
     align-items: center;
     box-sizing: border-box;
     padding: 0 .5rem;
-    margin: 0 0 .5rem 0;
+    margin: 0 0 .25rem 0;
 }
 
 .details {
@@ -172,14 +178,9 @@ export default {
 }
 
 .site {
-    border-radius: 0 0 .25rem 0;
     font-weight: bold;
 }
 
-.date {
-    border-radius: 0 0 0 .25rem;
-}
-
 .info {
     display: flex;
     flex-direction: column;
@@ -209,12 +210,12 @@ export default {
 .actors {
     word-wrap: break-word;
     overflow: hidden;
-    max-height: 2.5rem;
-    line-height: 1.25rem;
+    max-height: 2.75rem;
+    line-height: 1.5rem;
 }
 
 .tags {
-    max-height: 2.5rem;
+    max-height: 2.85rem;
     padding: .25rem .5rem 1rem .5rem;
     line-height: 1.25rem;
     word-wrap: break-word;
@@ -226,7 +227,7 @@ export default {
 }
 
 .tag {
-    margin: 0 .25rem .5rem 0;
+    margin: 0 .25rem .25rem 0;
 }
 
 .actor:not(:last-of-type)::after {
@@ -247,8 +248,8 @@ export default {
 
 .tag-link {
     color: $shadow;
+    display: inline-block;
     padding: .25rem;
-    border-radius: .25rem;
     box-shadow: 0 0 2px $shadow-weak;
     font-size: .75rem;
     font-weight: bold;

assets/components/tile/site.vue

@@ -27,6 +27,7 @@ export default {
 @import 'theme';
 
 .tile {
+    background: $background;
     display: flex;
     flex-direction: column;
     align-items: center;