2019-12-01 04:32:47 +00:00
|
|
|
<template>
|
|
|
|
<div class="tags">
|
2020-01-04 03:58:56 +00:00
|
|
|
<h3>Oral</h3>
|
2020-01-04 01:51:58 +00:00
|
|
|
|
|
|
|
<div class="tiles">
|
|
|
|
<Tag
|
|
|
|
v-for="tag in tags.oral"
|
|
|
|
:key="`tag-${tag.id}`"
|
|
|
|
:tag="tag"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
2020-01-05 00:07:32 +00:00
|
|
|
<h3>Penetration</h3>
|
2019-12-04 20:58:08 +00:00
|
|
|
|
|
|
|
<div class="tiles">
|
|
|
|
<Tag
|
2020-01-05 00:07:32 +00:00
|
|
|
v-for="tag in tags.penetration"
|
2019-12-04 20:58:08 +00:00
|
|
|
:key="`tag-${tag.id}`"
|
|
|
|
:tag="tag"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
2020-01-05 00:07:32 +00:00
|
|
|
<h3>Group</h3>
|
2019-12-04 20:58:08 +00:00
|
|
|
|
|
|
|
<div class="tiles">
|
|
|
|
<Tag
|
2020-01-05 00:07:32 +00:00
|
|
|
v-for="tag in tags.group"
|
2019-12-04 20:58:08 +00:00
|
|
|
:key="`tag-${tag.id}`"
|
|
|
|
:tag="tag"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
2020-01-05 00:07:32 +00:00
|
|
|
<h3>Ethnicity</h3>
|
2019-12-04 20:58:08 +00:00
|
|
|
|
|
|
|
<div class="tiles">
|
|
|
|
<Tag
|
2020-01-05 00:07:32 +00:00
|
|
|
v-for="tag in tags.ethnicity"
|
2019-12-04 20:58:08 +00:00
|
|
|
:key="`tag-${tag.id}`"
|
|
|
|
:tag="tag"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
2019-12-06 04:09:08 +00:00
|
|
|
<h3>Finish</h3>
|
2019-12-04 20:58:08 +00:00
|
|
|
|
|
|
|
<div class="tiles">
|
|
|
|
<Tag
|
2019-12-06 04:09:08 +00:00
|
|
|
v-for="tag in tags.finish"
|
2019-12-04 20:58:08 +00:00
|
|
|
:key="`tag-${tag.id}`"
|
|
|
|
:tag="tag"
|
|
|
|
/>
|
|
|
|
</div>
|
2020-01-04 01:51:58 +00:00
|
|
|
|
|
|
|
<h3>Misc</h3>
|
|
|
|
|
2020-02-13 02:44:04 +00:00
|
|
|
<div
|
|
|
|
v-if="tags.misc"
|
|
|
|
class="tiles"
|
|
|
|
>
|
2020-01-04 01:51:58 +00:00
|
|
|
<Tag
|
|
|
|
v-for="tag in tags.misc.concat(tags.body)"
|
|
|
|
:key="`tag-${tag.id}`"
|
|
|
|
:tag="tag"
|
|
|
|
/>
|
|
|
|
</div>
|
2019-12-01 04:32:47 +00:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import Tag from '../tile/tag.vue';
|
|
|
|
|
|
|
|
async function mounted() {
|
2019-12-04 20:58:08 +00:00
|
|
|
const tags = await this.$store.dispatch('fetchTags', {
|
2019-12-16 04:30:25 +00:00
|
|
|
slugs: [
|
2019-12-04 20:58:08 +00:00
|
|
|
'airtight',
|
|
|
|
'anal',
|
2020-01-04 01:51:58 +00:00
|
|
|
'anal-creampie',
|
|
|
|
'asian',
|
|
|
|
'ass-eating',
|
|
|
|
'ass-to-mouth',
|
2020-01-08 22:33:24 +00:00
|
|
|
'bdsm',
|
2020-01-04 01:51:58 +00:00
|
|
|
'blowbang',
|
|
|
|
'blowjob',
|
|
|
|
'bukkake',
|
|
|
|
'caucasian',
|
|
|
|
'creampie',
|
|
|
|
'da-tp',
|
|
|
|
'deepthroat',
|
2019-12-04 20:58:08 +00:00
|
|
|
'double-anal',
|
2020-01-04 01:51:58 +00:00
|
|
|
'double-blowjob',
|
2019-12-04 20:58:08 +00:00
|
|
|
'double-penetration',
|
|
|
|
'double-vaginal',
|
|
|
|
'dv-tp',
|
|
|
|
'ebony',
|
2020-01-08 22:33:24 +00:00
|
|
|
'facefucking',
|
2020-01-04 01:51:58 +00:00
|
|
|
'facial',
|
|
|
|
'gangbang',
|
2020-01-08 22:33:24 +00:00
|
|
|
'gaping',
|
2019-12-04 20:58:08 +00:00
|
|
|
'interracial',
|
|
|
|
'latina',
|
2020-01-04 01:51:58 +00:00
|
|
|
'mff',
|
|
|
|
'mfm',
|
2019-12-04 20:58:08 +00:00
|
|
|
'oral-creampie',
|
2020-01-04 01:51:58 +00:00
|
|
|
'orgy',
|
|
|
|
'pussy-eating',
|
2019-12-04 20:58:08 +00:00
|
|
|
'swallowing',
|
2020-01-04 01:51:58 +00:00
|
|
|
'tattoo',
|
|
|
|
'trainbang',
|
|
|
|
'triple-anal',
|
2019-12-04 20:58:08 +00:00
|
|
|
],
|
|
|
|
});
|
|
|
|
|
|
|
|
this.tags = tags.reduce((acc, tag) => {
|
2020-01-04 01:51:58 +00:00
|
|
|
if (!tag.group) {
|
|
|
|
return { ...acc, misc: [...acc.misc, tag] };
|
|
|
|
}
|
|
|
|
|
2019-12-04 20:58:08 +00:00
|
|
|
if (acc[tag.group.slug]) {
|
|
|
|
return { ...acc, [tag.group.slug]: [...acc[tag.group.slug], tag] };
|
|
|
|
}
|
|
|
|
|
|
|
|
return { ...acc, [tag.group.slug]: [tag] };
|
2020-01-04 01:51:58 +00:00
|
|
|
}, { misc: [] });
|
2020-01-30 23:12:58 +00:00
|
|
|
|
|
|
|
this.pageTitle = 'Tags';
|
2019-12-01 04:32:47 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export default {
|
|
|
|
components: {
|
|
|
|
Tag,
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
return {
|
2019-12-04 20:58:08 +00:00
|
|
|
tags: {},
|
2020-01-30 23:12:58 +00:00
|
|
|
pageTitle: null,
|
2019-12-01 04:32:47 +00:00
|
|
|
};
|
|
|
|
},
|
|
|
|
mounted,
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
2019-12-09 04:00:49 +00:00
|
|
|
@import 'theme';
|
|
|
|
|
2019-12-01 04:32:47 +00:00
|
|
|
.tags {
|
2019-12-04 20:58:08 +00:00
|
|
|
padding: 1rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.tiles {
|
2019-12-01 04:32:47 +00:00
|
|
|
display: grid;
|
|
|
|
grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
|
|
|
|
grid-gap: .5rem;
|
|
|
|
}
|
|
|
|
</style>
|