Updating stash page when stashing scene. Improved layout.

This commit is contained in:
DebaucheryLibrarian 2021-03-19 04:18:56 +01:00
parent fe2004b3da
commit 626cbc4fc5
1 changed files with 19 additions and 25 deletions

View File

@ -14,15 +14,13 @@
</div>
<div class="content-inner">
<ul
<Releases
v-if="stash.scenes?.length > 0"
class="stash-section stash-scenes nolist"
>
<li
v-for="item in stash.scenes"
:key="item.id"
><Scene :release="item.scene" /></li>
</ul>
:releases="stash.scenes.map(item => item.scene)"
class="stash-section stash-scenes"
@stash="fetchStash"
@unstash="fetchStash"
/>
<ul
v-if="stash.actors?.length > 0"
@ -39,7 +37,7 @@
<script>
import Actor from '../actors/tile.vue';
import Scene from '../releases/scene-tile.vue';
import Releases from '../releases/releases.vue';
async function fetchStash() {
this.stash = await this.$store.dispatch('fetchStash', this.$route.params.stashId);
@ -52,7 +50,7 @@ async function mounted() {
export default {
components: {
Actor,
Scene,
Releases,
},
data() {
return {
@ -89,27 +87,23 @@ export default {
}
}
.stash-section {
padding: 1rem;
&:not(:last-child) {
border-bottom: solid 1px var(--shadow-hint);
}
}
.stash-actors,
.stash-scenes {
display: grid;
flex-grow: 1;
grid-gap: .5rem;
box-sizing: border-box;
.stash-section:not(:last-child) {
border-bottom: solid 1px var(--shadow-hint);
}
.stash-actors {
display: grid;
grid-gap: .5rem;
grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
flex-grow: 1;
padding: 1rem;
}
.stash-scenes {
grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr));
flex-grow: 0;
.tiles {
grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr));
}
}
</style>