-
{{ release.title }}
+
+
{{ release.title }}
+
+ {{ release.shootId }}
+
-
Actors
+
Duration
+
-
-
@@ -230,8 +204,8 @@
// import config from 'config';
// import format from 'template-format';
-import Banner from './banner.vue';
-import Actor from '../tile/actor.vue';
+import Media from './media.vue';
+import Actor from '../actors/tile.vue';
import Release from '../tile/release.vue';
import Releases from './releases.vue';
import Scroll from '../scroll/scroll.vue';
@@ -256,7 +230,7 @@ async function mounted() {
export default {
components: {
Actor,
- Banner,
+ Media,
Release,
Releases,
Scroll,
@@ -284,6 +258,82 @@ export default {
box-sizing: border-box;
}
+.details {
+ background: var(--profile);
+ color: var(--text-light);
+ box-shadow: 0 0 3px var(--shadow-weak);
+ cursor: default;
+
+ .column {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 0 1rem;
+ }
+
+ .link {
+ color: var(--text-light);
+ }
+}
+
+.tidbits {
+ flex-shrink: 0;
+}
+
+.tidbit {
+ display: inline-flex;
+ align-items: center;
+ height: 100%;
+
+ &:not(:last-child) {
+ border-right: solid 1px var(--lighten-hint);
+ }
+
+ .icon {
+ fill: var(--lighten-weak);
+ margin: 0 .25rem 0 0;
+ }
+
+ &.date {
+ flex-shrink: 0;
+ padding: 0 1rem;
+ font-weight: bold;
+ }
+}
+
+.site {
+ display: inline-flex;
+ align-items: center;
+ padding: .25rem 0;
+ font-size: 0;
+}
+
+.logo {
+ display: inline-block;
+}
+
+.logo-site {
+ height: 3rem;
+ width: 100%;
+ max-width: 15rem;
+ object-fit: contain;
+ object-position: 100% 50%;
+}
+
+.logo-network {
+ height: 1.5rem;
+ max-width: 10rem;
+ object-fit: contain;
+ object-position: 100% 50%;
+}
+
+.chain {
+ color: var(--lighten);
+ padding: 0 .5rem;
+ font-weight: bold;
+ font-size: .8rem;
+}
+
.info {
padding: 1rem;
border-left: solid 1px var(--shadow-hint);
@@ -320,81 +370,20 @@ export default {
}
}
-.details {
- background: var(--profile);
- color: var(--text-light);
- box-shadow: 0 0 3px var(--shadow-weak);
- cursor: default;
-
- .column {
- display: flex;
- align-items: center;
- padding: 0 1rem;
- }
-
- .link {
- color: var(--text-light);
- }
-}
-
-.tidbit {
- display: inline-block;
- height: 100%;
-
- &:not(:last-child) {
- border-right: solid 1px var(--lighten-hint);
- }
-
- .icon {
- fill: var(--lighten-weak);
- margin: 0 .25rem 0 0;
- }
-
- &.date,
- &.duration,
- &.shoot {
- flex-shrink: 0;
- padding: 1.25rem 1rem 1.25rem 0;
- margin: 0 1rem 0 0;
- }
-}
-
-.site {
- display: inline-flex;
- flex-grow: 1;
- align-items: center;
- justify-content: flex-end;
- padding: .25rem 0;
- font-size: 0;
-}
-
-.logo {
- display: inline-block;
-}
-
-.logo-site {
- height: 3rem;
- max-width: 15rem;
- object-fit: contain;
- object-position: 100% 50%;
-}
-
-.logo-network {
- height: 1.5rem;
- max-width: 10rem;
- object-fit: contain;
- object-position: 100% 50%;
-}
-
-.chain {
- color: var(--lighten);
- padding: 0 .5rem;
- font-weight: bold;
- font-size: .8rem;
+.title-container {
+ display: flex;
+ justify-content: space-between;
}
.title {
- margin: 0 0 1.5rem 0;
+ margin: 0;
+}
+
+.title-shoot {
+ margin: 0 0 0 .5rem;
+ color: var(--shadow);
+ font-size: .9rem;
+ font-weight: bold;
}
.description {
@@ -409,18 +398,18 @@ export default {
font-size: 1rem;
}
+.scroll {
+ border-bottom: solid 1px var(--shadow-hint);
+}
+
.actors {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
- grid-gap: 1rem;
+ grid-gap: .5rem;
flex-grow: 1;
flex-wrap: wrap;
}
-.actor {
- margin: 0 1rem .5rem 0;
-}
-
.filename {
width: 100%;
padding: .5rem;
@@ -481,10 +470,9 @@ export default {
display: inline-block;
}
- .logo-site {
- width: 15rem;
- max-width: 100%;
- }
+ .site {
+ max-width: 100%;
+ }
.actors {
grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
diff --git a/assets/components/scroll/scroll.vue b/assets/components/scroll/scroll.vue
index f0dd973b..fbb3e42d 100644
--- a/assets/components/scroll/scroll.vue
+++ b/assets/components/scroll/scroll.vue
@@ -7,43 +7,45 @@
@expand="(state) => expanded = state"
/>
- expanded = state"
- />
+
expanded = state"
/>
expanded = state"
@@ -78,6 +80,8 @@ function mounted() {
});
window.addEventListener('resize', this.updateScroll);
+
+ this.updateScroll();
setTimeout(() => this.updateScroll(), 500); // allow CSS to calculate
}
@@ -86,6 +90,10 @@ function beforeDestroy() {
window.removeEventListener('resize', this.updateScroll);
}
+function updated() {
+ this.updateScroll();
+}
+
export default {
components: {
Expand,
@@ -110,6 +118,7 @@ export default {
};
},
mounted,
+ updated,
beforeDestroy,
methods: {
scroll,
@@ -123,8 +132,6 @@ export default {
.scroll {
background: var(--profile);
- position: relative;
- padding: 0 1rem 0 0;
&.expanded {
padding: 0;
@@ -135,6 +142,10 @@ export default {
}
}
+.scrollable {
+ position: relative;
+}
+
.expand-light {
display: none;
}
diff --git a/assets/components/tags/tile.vue b/assets/components/tags/tile.vue
index 382ef6d6..e24cab84 100644
--- a/assets/components/tags/tile.vue
+++ b/assets/components/tags/tile.vue
@@ -1,6 +1,6 @@
diff --git a/assets/js/router.js b/assets/js/router.js
index 5052d4c1..0880d339 100644
--- a/assets/js/router.js
+++ b/assets/js/router.js
@@ -113,7 +113,7 @@ const routes = [
}),
},
{
- path: '/tag/:tagSlug:range',
+ path: '/tag/:tagSlug/:range',
component: Tag,
name: 'tag',
},
diff --git a/docs/associated-tags.sql b/docs/associated-tags.sql
new file mode 100644
index 00000000..da4d9624
--- /dev/null
+++ b/docs/associated-tags.sql
@@ -0,0 +1,5 @@
+SELECT tags.name FROM actors
+LEFT JOIN releases_actors ON releases_actors.actor_id = actors.id
+LEFT JOIN releases_tags ON releases_tags.release_id = releases_actors.release_id
+LEFT JOIN tags ON tags.id = releases_tags.tag_id
+WHERE actors.slug = 'vina-sky';