Associating actors without network.

assets/components/actors/actors.vue

@@ -145,7 +145,7 @@ export default {
 
 .tiles {
     display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
+    grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
     grid-gap: 0 .5rem;
     padding: 1rem;
     flex-grow: 1;

assets/components/header/header.vue

@@ -68,6 +68,7 @@
             <div class="header-toggles">
                 <Icon
                     v-show="!sfw"
+                    v-tooltip="'Hit S to use SFW mode'"
                     icon="flower"
                     class="toggle noselect"
                     @click.native="setSfw(true)"
@@ -75,6 +76,7 @@
 
                 <Icon
                     v-show="sfw"
+                    v-tooltip="'Hit N to use NSFW mode'"
                     icon="flower"
                     class="toggle active noselect"
                     @click.native="setSfw(false)"
@@ -82,6 +84,7 @@
 
                 <Icon
                     v-show="theme === 'light'"
+                    v-tooltip="'Hit D to use dark theme'"
                     icon="moon"
                     class="toggle noselect"
                     @click.native="setTheme('dark')"
@@ -89,6 +92,7 @@
 
                 <Icon
                     v-show="theme === 'dark'"
+                    v-tooltip="'Hit L to use light theme'"
                     icon="sun"
                     class="toggle noselect"
                     @click.native="setTheme('light')"

assets/components/tags/tag.vue

@@ -14,6 +14,12 @@
                     <Icon icon="price-tag4" />
                     {{ tag.name }}
                 </h2>
+
+                <p
+                    v-if="description"
+                    class="description header-description"
+                    v-html="description"
+                />
             </div>
 
             <div class="sidebar">
@@ -116,6 +122,12 @@ export default {
         color: var(--primary);
     }
 }
+
+.header .description,
+.header .description p {
+    padding: 0;
+    margin: 0;
+}
 </style>
 
 <style lang="scss" scoped>
@@ -147,15 +159,12 @@ export default {
     background: var(--profile);
     color: var(--text-light);
     display: none;
+    justify-content: space-between;
     padding: .5rem 1rem;
 
     .title {
         margin: 0 2rem 0 0;
     }
-
-    .description {
-        padding: 0;
-    }
 }
 
 .sidebar {

assets/components/tags/tags.vue

@@ -34,18 +34,19 @@ async function mounted() {
         popular: [
             'anal',
             'lesbian',
+            'interracial',
             'mff',
             'mfm',
-            'interracial',
+            'natural-boobs',
+            'fake-boobs',
+            'teen',
+            'milf',
             'blowjob',
             'orgy',
             'gangbang',
             'double-penetration',
-            'airtight',
             'facial',
             'creampie',
-            'teen',
-            'milf',
         ],
         oral: [
             'deepthroat',
@@ -65,6 +66,14 @@ async function mounted() {
             'brunette',
             'redhead',
         ],
+        extreme: [
+            'airtight',
+            'double-anal',
+            'double-vaginal',
+            'da-tp',
+            'dv-tp',
+            'triple-anal',
+        ],
         cumshot: [
             'facial',
             'bukkake',
@@ -72,13 +81,6 @@ async function mounted() {
             'anal-creampie',
             'cum-in-mouth',
         ],
-        extreme: [
-            'double-anal',
-            'double-vaginal',
-            'da-tp',
-            'dv-tp',
-            'triple-anal',
-        ],
         roleplay: [
             'family',
             'schoolgirl',
@@ -130,7 +132,7 @@ export default {
 
 .tiles {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(23rem, .33fr));
+    grid-template-columns: repeat(auto-fill, minmax(23rem, .33fr));
     grid-gap: 1rem;
     margin: 0 0 1.5rem 0;
 }
@@ -142,13 +144,13 @@ export default {
 
 @media(max-width: $breakpoint3) {
     .tiles {
-        grid-template-columns: repeat(auto-fit, minmax(21rem, .5fr));
+        grid-template-columns: repeat(auto-fill, minmax(21rem, .5fr));
     }
 }
 
 @media(max-width: $breakpoint) {
     .tiles {
-        grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
+        grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
     }
 }
 </style>

assets/components/tile/release.vue

@@ -132,6 +132,7 @@
             </span>
 
             <ul
+                v-if="release.tags.length > 0"
                 :title="release.tags.map(tag => tag.name).join(', ')"
                 class="tags nolist"
             >

assets/js/actors/actions.js

@@ -8,6 +8,10 @@ import { curateRelease } from '../curate';
 import getDateRange from '../get-date-range';
 
 function curateActor(actor) {
+    if (!actor) {
+        return null;
+    }
+
     const curatedActor = {
         ...actor,
         height: actor.heightMetric && {
@@ -49,7 +53,7 @@ function initActorActions(store, _router) {
     async function fetchActorBySlug({ _commit }, { actorSlug, limit = 100, range = 'latest' }) {
         const { before, after, orderBy } = getDateRange(range);
 
-        const { actor } = await graphql(`
+        const { actors: [actor] } = await graphql(`
             query Actor(
                 $actorSlug: String!
                 $limit:Int = 1000,
@@ -58,7 +62,14 @@ function initActorActions(store, _router) {
                 $orderBy:[ReleasesActorsOrderBy!]
                 $exclude: [String!]
             ) {
-                actor: actorBySlug(slug: $actorSlug) {
+                actors(filter: {
+                    slug: {
+                        equalTo: $actorSlug,
+                    },
+                    networkId: {
+                        isNull: true,
+                    },
+                }) {
                     id
                     name
                     slug
@@ -84,11 +95,13 @@ function initActorActions(store, _router) {
                         name
                         slug
                     }
-                    avatar: actorsAvatarByActorId {
-                        media {
-                            thumbnail
-                            path
-                            copyright
+                    actorsProfiles {
+                        actorsAvatarByProfileId {
+                            media {
+                                path
+                                thumbnail
+                                copyright
+                            }
                         }
                     }
                     photos: actorsPhotos {
@@ -225,9 +238,13 @@ function initActorActions(store, _router) {
                         name
                         slug
                     }
-                    avatar: actorsAvatarByActorId {
-                        media {
-                            thumbnail
+                    actorsProfiles {
+                        actorsAvatarByProfileId {
+                            media {
+                                path
+                                thumbnail
+                                copyright
+                            }
                         }
                     }
                     birthCountry: countryByBirthCountryAlpha2 {

assets/js/fragments.js

@@ -47,9 +47,13 @@ const actorFields = `
           name
           alias
         }
-        avatar: actorsAvatarByActorId {
-            media {
-                thumbnail
+        actorsProfiles {
+            actorsAvatarByProfileId {
+                media {
+                    path
+                    thumbnail
+                    copyright
+                }
             }
         }
 `;

assets/js/ui/observers.js

@@ -11,6 +11,14 @@ function initUiObservers(store, _router) {
         if (event.key === 'n') {
             store.dispatch('setSfw', false);
         }
+
+        if (event.key === 'd') {
+            store.dispatch('setTheme', 'dark');
+        }
+
+        if (event.key === 'l') {
+            store.dispatch('setTheme', 'light');
+        }
     });
 }