Compare commits
40 commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
15d487ec6f | ||
|
|
d716e192bb | ||
|
|
6aa34c1648 | ||
|
|
34823665c6 | ||
|
|
134e2c79cc | ||
|
|
b0abfd8311 | ||
|
|
61cd15fd5b | ||
|
|
f3f94be6ae | ||
|
|
61147be693 | ||
|
|
6a1474eb52 | ||
|
|
f4b1003801 | ||
|
|
5d94323bdd | ||
|
|
d2774e8150 | ||
|
|
89831a64a2 | ||
|
|
4c8d576f13 | ||
|
|
0c8a3b0348 | ||
|
|
0335006ee5 | ||
|
|
07bd197c29 | ||
|
|
a0b2062137 | ||
|
|
d5cf84e592 | ||
|
|
cd9c1d950d | ||
|
|
665f2c6b35 | ||
|
|
30a573e9cf | ||
|
|
ddde6df30b | ||
|
|
d5703cc274 | ||
|
|
778142c4c1 | ||
|
|
d984651fc8 | ||
|
|
9a529b62fb | ||
|
|
c143956e9f | ||
|
|
120a1a03e3 | ||
|
|
08e01502c5 | ||
|
|
314255dc31 | ||
|
|
1b036d3278 | ||
|
|
b450849075 | ||
|
|
f100c524af | ||
|
|
d196c1e680 | ||
|
|
f147510c04 | ||
|
|
6cf6e6d045 | ||
|
|
ff665a6cea | ||
|
|
a2e2c1f791 |
29 changed files with 2280 additions and 5631 deletions
|
|
@ -1,2 +1,3 @@
|
|||
defaults
|
||||
>1% and not dead
|
||||
last 2 versions
|
||||
not dead
|
||||
|
|
|
|||
2
.gitignore
vendored
2
.gitignore
vendored
|
|
@ -26,3 +26,5 @@ coverage
|
|||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
||||
*.tsbuildinfo
|
||||
|
|
|
|||
6
.vscode/extensions.json
vendored
6
.vscode/extensions.json
vendored
|
|
@ -1,3 +1,7 @@
|
|||
{
|
||||
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
|
||||
"recommendations": [
|
||||
"Vue.volar",
|
||||
"dbaeumer.vscode-eslint",
|
||||
"esbenp.prettier-vscode"
|
||||
]
|
||||
}
|
||||
|
|
|
|||
11
index.html
11
index.html
|
|
@ -17,11 +17,12 @@
|
|||
<meta name="twitter:description" content="The official reference page for Sebin Nyshkim with picture references and in-depth character descriptions" />
|
||||
<meta name="twitter:image" content="https://ref.sebin-nyshkim.net/sebin/preview.png" />
|
||||
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:title" content="Sebin Nyshkim - Reference Page" />
|
||||
<meta name="og:url" content="https://ref.sebin-nyshkim.net/sebin/" />
|
||||
<meta name="og:image" content="https://ref.sebin-nyshkim.net/sebin/preview.png" />
|
||||
<meta name="og:description" content="The official reference page for Sebin Nyshkim with picture references and in-depth character descriptions" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:title" content="Sebin Nyshkim - Reference Page" />
|
||||
<meta property="og:locale" content="en_US" />
|
||||
<meta property="og:url" content="https://ref.sebin-nyshkim.net/sebin/" />
|
||||
<meta property="og:image" content="https://ref.sebin-nyshkim.net/sebin/preview.png" />
|
||||
<meta property="og:description" content="The official reference page for Sebin Nyshkim with picture references and in-depth character descriptions" />
|
||||
</head>
|
||||
<body>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
|
|
|
|||
6956
package-lock.json
generated
6956
package-lock.json
generated
File diff suppressed because it is too large
Load diff
46
package.json
46
package.json
|
|
@ -1,36 +1,38 @@
|
|||
{
|
||||
"name": "sebin-reference",
|
||||
"version": "0.10.0",
|
||||
"version": "0.10.7",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "vite --host",
|
||||
"build": "run-p type-check build-only",
|
||||
"build": "run-p type-check \"build-only {@}\" --",
|
||||
"preview": "vite preview",
|
||||
"build-only": "vite build",
|
||||
"type-check": "vue-tsc --noEmit",
|
||||
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
|
||||
"type-check": "vue-tsc --build --force",
|
||||
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
|
||||
"format": "prettier --write src/"
|
||||
},
|
||||
"dependencies": {
|
||||
"vue": "^3.2.45",
|
||||
"vue-router": "^4.1.6"
|
||||
"vue": "^3.4.38",
|
||||
"vue-router": "^4.4.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rushstack/eslint-patch": "^1.2.0",
|
||||
"@types/node": "^18.15.11",
|
||||
"@vitejs/plugin-vue": "^4.1.0",
|
||||
"@vue/eslint-config-prettier": "^7.1.0",
|
||||
"@vue/eslint-config-typescript": "^11.0.2",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"autoprefixer": "^10.4.14",
|
||||
"eslint": "^8.37.0",
|
||||
"eslint-plugin-vue": "^9.10.0",
|
||||
"@rushstack/eslint-patch": "^1.10.4",
|
||||
"@tsconfig/node20": "^20.1.4",
|
||||
"@types/node": "^20.16.3",
|
||||
"@vitejs/plugin-vue": "^5.1.3",
|
||||
"@vue/eslint-config-prettier": "^9.0.0",
|
||||
"@vue/eslint-config-typescript": "^13.0.0",
|
||||
"@vue/tsconfig": "^0.5.1",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-plugin-vue": "^9.28.0",
|
||||
"normalize.css": "^8.0.1",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"prettier": "^2.8.7",
|
||||
"sass": "^1.60.0",
|
||||
"typescript": "^4.9.5",
|
||||
"vite": "^4.2.1",
|
||||
"vite-imagetools": "^4.0.18",
|
||||
"vue-tsc": "^1.2.0"
|
||||
"npm-run-all2": "^6.2.2",
|
||||
"prettier": "^3.3.3",
|
||||
"sass": "^1.77.8",
|
||||
"typescript": "~5.5.0",
|
||||
"vite": "^5.4.2",
|
||||
"vite-imagetools": "^6.2.9",
|
||||
"vue-tsc": "^2.1.4"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -62,21 +62,21 @@ provide(showModalKey, showModal)
|
|||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/sebin-smug-icon.png?w=36;40;48;56;72;80;96;112;108;120;144;168&avif&quality=75&srcset
|
||||
@/assets/sebin-smug-icon.png?w=36;40;48;56;72;80;96;112;108;120;144;168&format=avif&quality=75&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 56px, (min-width: 80em) 48px, (min-width: 35em) 40px, 36px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/sebin-smug-icon.png?w=36;40;48;56;72;80;96;112;108;120;144;168&webp&quality=100&srcset
|
||||
@/assets/sebin-smug-icon.png?w=36;40;48;56;72;80;96;112;108;120;144;168&format=webp&quality=100&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 56px, (min-width: 80em) 48px, (min-width: 35em) 40px, 36px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
class="nav-logo"
|
||||
srcset="@/assets/sebin-smug-icon.png?w=36;40;48;56;72;80;96;112;108;120;144;168&png&srcset"
|
||||
srcset="@/assets/sebin-smug-icon.png?w=36;40;48;56;72;80;96;112;108;120;144;168&format=png&as=srcset"
|
||||
sizes="(min-width: 120em) 56px, (min-width: 80em) 48px, (min-width: 35em) 40px, 36px"
|
||||
alt="Sebin Avatar"
|
||||
/>
|
||||
|
|
|
|||
BIN
src/assets/refs/clothes/lazy/fullbody.png
Normal file
BIN
src/assets/refs/clothes/lazy/fullbody.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 232 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 42 KiB |
BIN
src/assets/refs/clothes/lazy/undies.png
Normal file
BIN
src/assets/refs/clothes/lazy/undies.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
161
src/components/FilterButton.vue
Normal file
161
src/components/FilterButton.vue
Normal file
|
|
@ -0,0 +1,161 @@
|
|||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import { Ratings } from '@/interfaces'
|
||||
|
||||
interface Props {
|
||||
modelValue: number[]
|
||||
name?: string
|
||||
value: Ratings
|
||||
}
|
||||
|
||||
interface Emits {
|
||||
(e: 'update:modelValue', value: number[]): void
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const emit = defineEmits<Emits>()
|
||||
|
||||
const checked = computed({
|
||||
get() {
|
||||
return props.modelValue
|
||||
},
|
||||
set(value) {
|
||||
emit('update:modelValue', value)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="filter-button">
|
||||
<input
|
||||
class="filter-button__input"
|
||||
type="checkbox"
|
||||
:name="name"
|
||||
:id="Ratings[value].toLowerCase()"
|
||||
:value="value"
|
||||
v-model="checked"
|
||||
/>
|
||||
<label
|
||||
:for="Ratings[value].toLowerCase()"
|
||||
class="filter-button__label"
|
||||
:class="[Ratings[value].toLowerCase()]"
|
||||
>
|
||||
{{ Ratings[value] }}
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.filter-button {
|
||||
flex: 1 1 0;
|
||||
|
||||
&__input {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&__input:checked + &__label {
|
||||
top: 0.25rem;
|
||||
box-shadow: 0 0.25rem 0 0 var(--color-button-box-shadow);
|
||||
|
||||
&.love {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-love-dark);
|
||||
}
|
||||
|
||||
&.yes {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-yes-dark);
|
||||
}
|
||||
|
||||
&.maybe {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-maybe-dark);
|
||||
}
|
||||
|
||||
&.no {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-no-dark);
|
||||
}
|
||||
}
|
||||
|
||||
&__label {
|
||||
display: block;
|
||||
|
||||
position: relative;
|
||||
top: 0;
|
||||
|
||||
background-color: var(--color-button);
|
||||
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
|
||||
margin: 0.5rem 0;
|
||||
border-radius: 0.25rem;
|
||||
padding: 0.5rem 1rem;
|
||||
|
||||
box-shadow: 0 0.5rem 0 0 var(--color-button-box-shadow);
|
||||
|
||||
transition: all 0.1s ease-out;
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
top: -0.25rem;
|
||||
box-shadow: 0 0.75rem 0 0 var(--color-button-box-shadow);
|
||||
}
|
||||
|
||||
&:active {
|
||||
top: 0.25rem;
|
||||
box-shadow: 0 0.25rem 0 0 var(--color-button-box-shadow);
|
||||
}
|
||||
|
||||
&.love {
|
||||
background-color: var(--theme-c-love);
|
||||
box-shadow: 0 0.5rem 0 0 var(--theme-c-love-dark);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0.75rem 0 0 var(--theme-c-love-dark);
|
||||
}
|
||||
|
||||
&:active {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-love-dark);
|
||||
}
|
||||
}
|
||||
|
||||
&.yes {
|
||||
background-color: var(--theme-c-yes);
|
||||
box-shadow: 0 0.5rem 0 0 var(--theme-c-yes-dark);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0.75rem 0 0 var(--theme-c-yes-dark);
|
||||
}
|
||||
|
||||
&:active {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-yes-dark);
|
||||
}
|
||||
}
|
||||
|
||||
&.maybe {
|
||||
background-color: var(--theme-c-maybe);
|
||||
box-shadow: 0 0.5rem 0 0 var(--theme-c-maybe-dark);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0.75rem 0 0 var(--theme-c-maybe-dark);
|
||||
}
|
||||
|
||||
&:active {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-maybe-dark);
|
||||
}
|
||||
}
|
||||
|
||||
&.no {
|
||||
background-color: var(--theme-c-no);
|
||||
box-shadow: 0 0.5rem 0 0 var(--theme-c-no-dark);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0.75rem 0 0 var(--theme-c-no-dark);
|
||||
}
|
||||
|
||||
&:active {
|
||||
box-shadow: 0 0.25rem 0 0 var(--theme-c-no-dark);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
77
src/components/FilterListTag.vue
Normal file
77
src/components/FilterListTag.vue
Normal file
|
|
@ -0,0 +1,77 @@
|
|||
<script setup lang="ts">
|
||||
interface Props {
|
||||
type: string
|
||||
}
|
||||
|
||||
defineProps<Props>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<span class="filter-list__tag" :class="type.toLowerCase()">
|
||||
<span>{{ type }}</span>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.filter-list {
|
||||
&__tag {
|
||||
flex: 0 0 0;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
|
||||
font-size: 0.75rem;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
|
||||
background: rgba(#f5f5f5, 0.7);
|
||||
|
||||
border: 1px solid #f5f5f5;
|
||||
border-radius: 1em;
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
|
||||
&.love span {
|
||||
background: var(--theme-c-love);
|
||||
border: 1px solid var(--theme-c-love-dark);
|
||||
}
|
||||
|
||||
&.yes span {
|
||||
background: var(--theme-c-yes);
|
||||
border: 1px solid var(--theme-c-yes-dark);
|
||||
}
|
||||
|
||||
&.maybe span {
|
||||
background: var(--theme-c-maybe);
|
||||
border: 1px solid var(--theme-c-maybe-dark);
|
||||
}
|
||||
|
||||
&.no span {
|
||||
background: var(--theme-c-no);
|
||||
border: 1px solid var(--theme-c-no-dark);
|
||||
}
|
||||
|
||||
&.category {
|
||||
flex: 0 0 3rem;
|
||||
}
|
||||
|
||||
&.receive {
|
||||
flex: 0 0 3.125rem;
|
||||
|
||||
span {
|
||||
background: var(--theme-c-receive);
|
||||
border: 1px solid var(--theme-c-receive);
|
||||
}
|
||||
}
|
||||
|
||||
&.give {
|
||||
flex: 0 0 2.125rem;
|
||||
|
||||
span {
|
||||
background: var(--theme-c-give);
|
||||
border: 1px solid var(--theme-c-give);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
127
src/components/FilteredList.vue
Normal file
127
src/components/FilteredList.vue
Normal file
|
|
@ -0,0 +1,127 @@
|
|||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue'
|
||||
import { Ratings, Role } from '@/interfaces'
|
||||
import type { Kink } from '@/interfaces'
|
||||
import FilterButton from '@/components/FilterButton.vue'
|
||||
import FilterListTag from '@/components/FilterListTag.vue'
|
||||
|
||||
interface Props {
|
||||
data: Kink[]
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
|
||||
const filterOptions = ref<number[]>([])
|
||||
|
||||
const filteredItems = computed(() =>
|
||||
[...props.data]
|
||||
.sort((a, b) => a.rating - b.rating)
|
||||
.filter((kink) => filterOptions.value.some((filterNum) => kink.rating === filterNum))
|
||||
)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="filter-list">
|
||||
<div class="filter-list__filters">
|
||||
<FilterButton name="rating" :value="Ratings.Love" v-model="filterOptions" />
|
||||
<FilterButton name="rating" :value="Ratings.Yes" v-model="filterOptions" />
|
||||
<FilterButton name="rating" :value="Ratings.Maybe" v-model="filterOptions" />
|
||||
<FilterButton name="rating" :value="Ratings.No" v-model="filterOptions" />
|
||||
</div>
|
||||
|
||||
<div class="filter-list__list-container">
|
||||
<template v-if="filterOptions.length > 0">
|
||||
<ul class="filter-list__list">
|
||||
<li v-for="(item, idx) in filteredItems" :key="idx" class="filter-list__item">
|
||||
<FilterListTag
|
||||
v-if="filterOptions.length > 1"
|
||||
class="category"
|
||||
:type="Ratings[item.rating]"
|
||||
/>
|
||||
<span class="filter-list__item-name">
|
||||
<span>{{ item.name }}</span>
|
||||
</span>
|
||||
<FilterListTag
|
||||
v-if="((item.role ?? 0) & Role.Receive) === Role.Receive"
|
||||
:type="Role[Role.Receive]"
|
||||
/>
|
||||
<FilterListTag
|
||||
v-if="((item.role ?? 0) & Role.Give) === Role.Give"
|
||||
:type="Role[Role.Give]"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<p class="filter-list__intro-msg">Select one of the categories above</p>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.filter-list {
|
||||
background: var(--quickfacts-background);
|
||||
border-radius: 1rem;
|
||||
box-shadow: var(--container-box-shadow);
|
||||
overflow: hidden;
|
||||
|
||||
&__options {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
&__filters {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
|
||||
border-collapse: collapse;
|
||||
padding: 0.5rem 0.75rem;
|
||||
}
|
||||
|
||||
&__intro-msg {
|
||||
font-size: 2rem;
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
&__list-container {
|
||||
border-top: 0.125rem solid var(--color-quickfacts-border);
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
&__list {
|
||||
max-height: 30rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
&__item {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
|
||||
padding: 0.25rem 0.875rem;
|
||||
|
||||
&:hover {
|
||||
background: rgba(#000, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
&__item-name {
|
||||
flex: 1 0 0;
|
||||
line-height: 2;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -4,6 +4,7 @@ import { nsfwKey, showModalKey } from '@/keys'
|
|||
import RefToggle from '@/components/RefToggle.vue'
|
||||
|
||||
interface Props {
|
||||
cornerText?: boolean
|
||||
polaroidBorder?: boolean
|
||||
dropshadow?: boolean
|
||||
nsfw?: boolean
|
||||
|
|
@ -18,7 +19,13 @@ defineProps<Props>()
|
|||
|
||||
<template>
|
||||
<figure class="figure">
|
||||
<div class="figure__border" :class="{ 'figure__border--polaroid': polaroidBorder }">
|
||||
<div
|
||||
class="figure__border"
|
||||
:class="{
|
||||
'figure__border--polaroid': polaroidBorder,
|
||||
'figure__border--cornertext': cornerText
|
||||
}"
|
||||
>
|
||||
<template v-if="!nsfw || isNsfw">
|
||||
<div class="figure__image" :class="{ 'figure__image--dropshadow': dropshadow }">
|
||||
<slot name="img"></slot>
|
||||
|
|
@ -48,18 +55,14 @@ defineProps<Props>()
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<figcaption class="figure__meta">
|
||||
<template v-if="!nsfw || isNsfw">
|
||||
<template v-if="!nsfw || isNsfw">
|
||||
<figcaption class="figure__meta">
|
||||
<div class="caption">
|
||||
<slot name="caption"></slot>
|
||||
</div>
|
||||
<div class="copyright">© <slot name="copyright"></slot></div>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<p>😳 2 hot 4 u 🍆</p>
|
||||
</template>
|
||||
</figcaption>
|
||||
</figcaption>
|
||||
</template>
|
||||
</div>
|
||||
</figure>
|
||||
</template>
|
||||
|
|
@ -93,6 +96,40 @@ defineProps<Props>()
|
|||
}
|
||||
}
|
||||
|
||||
&__border--cornertext {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&__border--cornertext img,
|
||||
&__border--cornertext &__cencor {
|
||||
margin: 1rem 0;
|
||||
border-radius: 1rem;
|
||||
filter: drop-shadow(0 0 0.625rem black);
|
||||
}
|
||||
|
||||
&__border--cornertext &__meta {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
|
||||
font-size: 0.75rem;
|
||||
|
||||
margin: 0 0 1.35rem 0;
|
||||
border-radius: 1em 0 1rem 0;
|
||||
padding: 0.25rem 0.75rem;
|
||||
|
||||
.caption,
|
||||
.copyright {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.caption {
|
||||
margin: 0 0.125rem 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__border--polaroid &__meta {
|
||||
font-family: 'Permanent Marker', fantasy;
|
||||
color: var(--color-figure-polaroid-text);
|
||||
|
|
|
|||
|
|
@ -7,8 +7,12 @@ interface Props {
|
|||
name?: string
|
||||
}
|
||||
|
||||
interface Emits {
|
||||
(e: 'update:modelValue', value: boolean): void
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const emit = defineEmits(['update:modelValue'])
|
||||
const emit = defineEmits<Emits>()
|
||||
|
||||
const checked = computed({
|
||||
get() {
|
||||
|
|
|
|||
|
|
@ -5,21 +5,21 @@
|
|||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/sebin-smug-icon.png?w=180;200;240;280;350;400;480;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/sebin-smug-icon.png?w=180;200;240;280;350;400;480;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 280px, (min-width: 80em) 240px, (min-width: 35em) 200px, 180px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/sebin-smug-icon.png?w=180;200;240;280;350;400;480;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/sebin-smug-icon.png?w=180;200;240;280;350;400;480;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 280px, (min-width: 80em) 240px, (min-width: 35em) 200px, 180px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/sebin-smug-icon.png?w=180;200;240;280;350;400;480;0&png&withoutEnlargement&srcset
|
||||
@/assets/sebin-smug-icon.png?w=180;200;240;280;350;400;480;0&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 280px, (min-width: 80em) 240px, (min-width: 35em) 200px, 180px"
|
||||
alt="Sebin Avatar"
|
||||
|
|
|
|||
|
|
@ -5,8 +5,21 @@ interface ColorDict {
|
|||
|
||||
interface Kink {
|
||||
name: string
|
||||
receive: boolean
|
||||
give: boolean
|
||||
rating: number
|
||||
role?: Role
|
||||
}
|
||||
|
||||
export enum Ratings {
|
||||
Love,
|
||||
Yes,
|
||||
Maybe,
|
||||
No
|
||||
}
|
||||
|
||||
export enum Role {
|
||||
Give = 1,
|
||||
Receive = 2,
|
||||
Both = Give | Receive
|
||||
}
|
||||
|
||||
export type { ColorDict, Kink }
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import "fontfaces";
|
||||
@import 'fontfaces';
|
||||
|
||||
/* theme colors */
|
||||
:root {
|
||||
|
|
@ -28,6 +28,18 @@
|
|||
--theme-c-white: #ffffff;
|
||||
--theme-c-black: #000000;
|
||||
|
||||
--theme-c-love: #e00f60;
|
||||
--theme-c-yes: #2faf2a;
|
||||
--theme-c-maybe: #daa520;
|
||||
--theme-c-no: #8b0000;
|
||||
--theme-c-receive: #448dc9;
|
||||
--theme-c-give: #4a7d91;
|
||||
|
||||
--theme-c-love-dark: #9b0a41;
|
||||
--theme-c-yes-dark: #1f771c;
|
||||
--theme-c-maybe-dark: #997416;
|
||||
--theme-c-no-dark: #530000;
|
||||
|
||||
--theme-c-dull-red-translucent: #c64c35bf;
|
||||
--theme-c-indian-yellow-translucent: #eda958bf;
|
||||
--theme-c-dusky-blue-translucent: #4b608fbf;
|
||||
|
|
@ -100,8 +112,8 @@
|
|||
|
||||
/* general purpose variables */
|
||||
:root {
|
||||
--font-family-copy: "Dosis", sans-serif;
|
||||
--font-family-headings: "Zilla Slab", sans-serif;
|
||||
--font-family-copy: 'Dosis', sans-serif;
|
||||
--font-family-headings: 'Zilla Slab', sans-serif;
|
||||
|
||||
--font-size: 18px;
|
||||
--font-size-h1: 3rem;
|
||||
|
|
@ -128,8 +140,7 @@
|
|||
|
||||
--page-background: var(--theme-b-page-background-light);
|
||||
--header-background: var(--theme-b-navigation-background-light);
|
||||
--header-margin: 1rem var(--container-spacing-right-safe) 1rem
|
||||
var(--container-spacing-left-safe);
|
||||
--header-margin: 1rem var(--container-spacing-right-safe) 1rem var(--container-spacing-left-safe);
|
||||
--navigation-justify-content: flex-start;
|
||||
|
||||
--quickfacts-background: var(--theme-b-page-background-light);
|
||||
|
|
@ -172,8 +183,7 @@
|
|||
--social-links-flex-flow: row wrap;
|
||||
--social-links-flex: 1 1 50%;
|
||||
|
||||
--footer-padding: var(--container-spacing-top-safe) 0
|
||||
var(--container-spacing-bottom-safe) 0;
|
||||
--footer-padding: var(--container-spacing-top-safe) 0 var(--container-spacing-bottom-safe) 0;
|
||||
}
|
||||
|
||||
/* semantic color variables for this project */
|
||||
|
|
@ -231,8 +241,8 @@
|
|||
|
||||
--table-cell-padding: 0.5rem 1rem;
|
||||
|
||||
--figure-cencor-width: 20rem;
|
||||
--figure-cencor-height: 20rem;
|
||||
--figure-cencor-width: max(50vw, 20rem);
|
||||
--figure-cencor-height: max(50vh, 30rem);
|
||||
|
||||
--gallery-size: 1.5rem;
|
||||
--gallery-arrow-position: 2rem;
|
||||
|
|
|
|||
65
src/sebin.ts
65
src/sebin.ts
|
|
@ -1,3 +1,5 @@
|
|||
import { Ratings, Role } from '@/interfaces'
|
||||
|
||||
export const firstName = 'Sebin',
|
||||
middleName = 'Antario',
|
||||
lastName = 'Nyshkim',
|
||||
|
|
@ -31,21 +33,50 @@ export const firstName = 'Sebin',
|
|||
girth: 5 // cm
|
||||
},
|
||||
kinks = [
|
||||
{ name: 'Oral', receive: true, give: true },
|
||||
{ name: 'Anal', receive: true, give: true },
|
||||
{ name: 'Facial', receive: true, give: true },
|
||||
{ name: 'Creampie', receive: true, give: true },
|
||||
{ name: 'Bukkake', receive: true, give: true },
|
||||
{ name: 'Biting', receive: true, give: true },
|
||||
{ name: 'Nipple Play', receive: true, give: true },
|
||||
{ name: 'Rough', receive: true, give: true },
|
||||
{ name: 'Toys', receive: true, give: true },
|
||||
|
||||
{ name: 'Frotting', receive: true, give: true },
|
||||
{ name: 'Muscle Worship', receive: true, give: true },
|
||||
{ name: 'Filled Condoms', receive: true, give: true },
|
||||
{ name: 'Growth/Macro', receive: true, give: true },
|
||||
{ name: 'Size Difference', receive: true, give: true },
|
||||
{ name: 'Underwear', receive: true, give: true },
|
||||
{ name: 'Chubbies', receive: true, give: true }
|
||||
{ name: 'Absorption', rating: Ratings.No },
|
||||
{ name: 'Anal', rating: Ratings.Love, role: Role.Both },
|
||||
{ name: 'Auto-Fellatio', rating: Ratings.Yes },
|
||||
{ name: 'Biting', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Bukkake', rating: Ratings.Yes, role: Role.Give },
|
||||
{ name: 'Chastity', rating: Ratings.No },
|
||||
{ name: 'Chubby', rating: Ratings.Maybe },
|
||||
{ name: 'Clothed Sex', rating: Ratings.Yes },
|
||||
{ name: 'Cock Slapping', rating: Ratings.Yes, role: Role.Give },
|
||||
{ name: 'Coiling', rating: Ratings.Maybe, role: Role.Give },
|
||||
{ name: 'Competition', rating: Ratings.Maybe, role: Role.Give },
|
||||
{ name: 'Creampie', rating: Ratings.Yes, role: Role.Give },
|
||||
{ name: 'Crushing (Living/Objects)', rating: Ratings.No },
|
||||
{ name: 'Cum From Mouth/Nose', rating: Ratings.Yes, role: Role.Give },
|
||||
{ name: 'Cum Inflation (Light/Medium)', rating: Ratings.Yes },
|
||||
{ name: 'Deep-throat', rating: Ratings.Yes, role: Role.Receive },
|
||||
{ name: 'Dirty Talking', rating: Ratings.Yes },
|
||||
{ name: 'Excessive Cum', rating: Ratings.Love, role: Role.Both },
|
||||
{ name: 'Face-Fucking', rating: Ratings.Yes, role: Role.Give },
|
||||
{ name: 'Facial', rating: Ratings.Yes, role: Role.Give },
|
||||
{ name: 'Feet', rating: Ratings.No },
|
||||
{ name: 'Filled Condoms', rating: Ratings.Yes },
|
||||
{ name: 'Foreplay', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Frotting', rating: Ratings.Yes },
|
||||
{ name: 'Gangbangs', rating: Ratings.Yes },
|
||||
{ name: 'Growth', rating: Ratings.Love, role: Role.Receive },
|
||||
{ name: 'Handjobs', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Hotdogging', rating: Ratings.Yes, role: Role.Give },
|
||||
{ name: 'Kissing', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Macro', rating: Ratings.Love },
|
||||
{ name: 'Milking', rating: Ratings.Yes },
|
||||
{ name: 'Muscle Growth', rating: Ratings.Love, role: Role.Both },
|
||||
{ name: 'Muscle Worship', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Nipple Play', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Oral', rating: Ratings.Love, role: Role.Both },
|
||||
{ name: 'Rough', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Sheath Play', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Size Difference', rating: Ratings.Love },
|
||||
{ name: 'Slime/Goo Characters', rating: Ratings.Yes },
|
||||
{ name: 'Spanking', rating: Ratings.Maybe, role: Role.Give },
|
||||
{ name: 'Tailsex', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Toys', rating: Ratings.Yes, role: Role.Both },
|
||||
{ name: 'Underwear', rating: Ratings.Love },
|
||||
{ name: 'Unsanitary', rating: Ratings.No },
|
||||
{ name: 'Verbal Abuse', rating: Ratings.Maybe, role: Role.Give },
|
||||
{ name: 'Vore', rating: Ratings.No }
|
||||
]
|
||||
|
|
|
|||
|
|
@ -24,21 +24,21 @@ import AttackList from '@/components/AttackList.vue'
|
|||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-fire_breath-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-fire_breath-hires.png?w=640;960;1920;1330;1680&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-fire_breath-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-fire_breath-hires.png?w=640;960;1920;1330;1680&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-fire_breath-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&png&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-fire_breath-hires.png?w=640;960;1920;1330;1680&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
alt="Sebin Fire Breath"
|
||||
|
|
@ -61,21 +61,21 @@ import AttackList from '@/components/AttackList.vue'
|
|||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-flame_toss-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-flame_toss-hires.png?w=640;960;1920;1330;1680&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-flame_toss-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-flame_toss-hires.png?w=640;960;1920;1330;1680&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-flame_toss-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&png&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-flame_toss-hires.png?w=640;960;1920;1330;1680&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
alt="Sebin Fire Breath"
|
||||
|
|
@ -98,21 +98,21 @@ import AttackList from '@/components/AttackList.vue'
|
|||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-kindled_fist-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-kindled_fist-hires.png?w=640;960;1920;1330;1680&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-kindled_fist-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-kindled_fist-hires.png?w=640;960;1920;1330;1680&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-kindled_fist-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&png&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-kindled_fist-hires.png?w=640;960;1920;1330;1680&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
alt="Sebin Kindled Fist"
|
||||
|
|
@ -134,21 +134,21 @@ import AttackList from '@/components/AttackList.vue'
|
|||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-burning_twister-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-burning_twister-hires.png?w=640;960;1920;1330;1680&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-burning_twister-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-burning_twister-hires.png?w=640;960;1920;1330;1680&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/attacks/sebin-burning_twister-hires.png?w=640;400;480;560;1280;800;960;1120;1920;1200;1330;1680&png&withoutEnlargement&srcset
|
||||
@/assets/refs/attacks/sebin-burning_twister-hires.png?w=640;960;1920;1330;1680&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 560px, (min-width: 80em) 480px, (min-width: 45em) 400px, 640px"
|
||||
alt="Sebin Burning Twister"
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<picture v-if="isNsfw">
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-body-NSFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-body-NSFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -61,7 +61,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-body-NSFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-body-NSFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -75,7 +75,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-body-NSFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&png&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-body-NSFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -92,7 +92,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<picture v-else>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-body-SFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-body-SFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -106,7 +106,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-body-SFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-body-SFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -120,7 +120,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-body-SFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&png&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-body-SFW.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;2880;3240;3360&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -213,7 +213,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-expressions.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-expressions.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -227,7 +227,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-expressions.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-expressions.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -241,7 +241,7 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/sebin-ref-expressions.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;0&png&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-ref-expressions.png?w=480;720;1080;1280;1440;1600;1920;2240;960;2160;2560;0&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 2240px,
|
||||
(min-width: 100em) 1920px,
|
||||
|
|
@ -315,27 +315,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
</p>
|
||||
</section>
|
||||
|
||||
<RefFigure id="sebin-upper-body-ref" polaroidBorder>
|
||||
<RefFigure id="sebin-upper-body-ref" cornerText>
|
||||
<!-- max 3617px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/upper-body-ref.png?w=400;500;600;700;800;1000;1200;1500;1800&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/upper-body-ref.png?w=400;700;1000;1200;1500;1800&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/upper-body-ref.png?w=400;500;600;700;800;1000;1200;1500;1800&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/upper-body-ref.png?w=400;700;1000;1200;1500;1800&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/upper-body-ref.png?w=400;500;600;700;800;1000;1200;1500;1800&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/upper-body-ref.png?w=400;700;1000;1200;1500;1800&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
alt="Sebin's upper body closeup"
|
||||
|
|
@ -362,27 +362,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
</section>
|
||||
|
||||
<RefGallery>
|
||||
<RefFigure id="sebin-muscle-ref12" polaroidBorder>
|
||||
<RefFigure id="sebin-muscle-ref12" cornerText>
|
||||
<!-- max 1964px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref12.png?w=290;640;770;900;580;1280;1540;1800;870;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref12.png?w=290;770;900;580;1280;1540;1700;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 900px, (min-width: 80em) 770px, (min-width: 35em) 640px, 290px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref12.png?w=290;640;770;900;580;1280;1540;1800;870;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref12.png?w=290;770;900;580;1280;1540;1700;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 900px, (min-width: 80em) 770px, (min-width: 35em) 640px, 290px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref12.png?w=290;640;770;900;580;1280;1540;1800;870;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref12.png?w=290;770;900;580;1280;1540;1700;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 900px, (min-width: 80em) 770px, (min-width: 35em) 640px, 290px"
|
||||
alt="Sebin flexing"
|
||||
|
|
@ -395,27 +395,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://twitter.com/KidRhinoBoy">Chirros</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref1" polaroidBorder nsfw>
|
||||
<RefFigure id="sebin-muscle-ref1" cornerText nsfw>
|
||||
<!-- max 2480px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref1.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref1.png?w=400;700;1000;1200;1500;1800;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref1.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref1.png?w=400;700;1000;1200;1500;1800;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref1.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref1.png?w=400;700;1000;1200;1500;1800;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
alt="Sebin beckons"
|
||||
|
|
@ -428,27 +428,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://twitter.com/GrisserArt">Grisser</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref2" polaroidBorder>
|
||||
<RefFigure id="sebin-muscle-ref2" cornerText>
|
||||
<!-- max 2953px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref2.png?w=415;625;750;875;1250;1500;1750;1875;2250;2625&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref2.png?w=415;625;875;1250;1500;1750;2250;2625&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 875px, (min-width: 80em) 750px, (min-width: 35em) 625px, 415px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref2.png?w=415;625;750;875;1250;1500;1750;1875;2250;2625&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref2.png?w=415;625;875;1250;1500;1750;2250;2625&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 875px, (min-width: 80em) 750px, (min-width: 35em) 625px, 415px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref2.png?w=415;625;750;875;1250;1500;1750;1875;2250;2625&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref2.png?w=415;625;875;1250;1500;1750;2250;2625&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 875px, (min-width: 80em) 750px, (min-width: 35em) 625px, 415px"
|
||||
alt="Sebin jamming out to some tunes"
|
||||
|
|
@ -461,27 +461,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://twitter.com/artvalentinapaz">Valentina Paz</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref3" polaroidBorder>
|
||||
<RefFigure id="sebin-muscle-ref3" cornerText>
|
||||
<!-- max 4961px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref3.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref3.png?w=400;800;1000;1200;1500;1800;2100&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref3.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref3.png?w=400;800;1000;1200;1500;1800;2100&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref3.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref3.png?w=400;800;1000;1200;1500;1800;2100&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
alt="Sebin flexing"
|
||||
|
|
@ -494,27 +494,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://www.furaffinity.net/user/Marsel-Defender"> Marsel-Defender </a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref4" polaroidBorder nsfw>
|
||||
<RefFigure id="sebin-muscle-ref4" cornerText nsfw>
|
||||
<!-- max 3000px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref4.png?w=400;700;840;980;800;1400;1680;1960;1200;2100;2520;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref4.png?w=400;980;1400;1680;1960;2100;2520;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 980px, (min-width: 80em) 840px, (min-width: 35em) 700px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref4.png?w=400;700;840;980;800;1400;1680;1960;1200;2100;2520;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref4.png?w=400;980;1400;1680;1960;2100;2520;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 980px, (min-width: 80em) 840px, (min-width: 35em) 700px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref4.png?w=400;700;840;980;800;1400;1680;1960;1200;2100;2520;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref4.png?w=400;980;1400;1680;1960;2100;2520;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 980px, (min-width: 80em) 840px, (min-width: 35em) 700px, 400px"
|
||||
alt="Sebin soaping up"
|
||||
|
|
@ -527,27 +527,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://twitter.com/O_reowoof">(o)reo</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref5" polaroidBorder nsfw>
|
||||
<RefFigure id="sebin-muscle-ref5" cornerText nsfw>
|
||||
<!-- max 2000px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref5.jpg?w=415;525;630;735;830;1050;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref5.jpg?w=415;735;1050;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 735px, (min-width: 80em) 630px, (min-width: 35em) 525px, 415px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref5.jpg?w=415;525;630;735;830;1050;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref5.jpg?w=415;735;1050;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 735px, (min-width: 80em) 630px, (min-width: 35em) 525px, 415px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref5.jpg?w=415;525;630;735;830;1050;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref5.jpg?w=415;735;1050;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 735px, (min-width: 80em) 630px, (min-width: 35em) 525px, 415px"
|
||||
alt="Sebin bulging out"
|
||||
|
|
@ -560,27 +560,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://www.furaffinity.net/user/sexmuffin">SexMuffin</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref6" polaroidBorder nsfw>
|
||||
<RefFigure id="sebin-muscle-ref6" cornerText nsfw>
|
||||
<!-- max 1500px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref6.png?w=400;545;655;765;800;1090;1310;1200;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref6.png?w=400;765;1090;1310;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 765px, (min-width: 80em) 655px, (min-width: 35em) 545px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref6.png?w=400;545;655;765;800;1090;1310;1200;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref6.png?w=400;765;1090;1310;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 765px, (min-width: 80em) 655px, (min-width: 35em) 545px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref6.png?w=400;545;655;765;800;1090;1310;1200;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref6.png?w=400;765;1090;1310;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 765px, (min-width: 80em) 655px, (min-width: 35em) 545px, 400px"
|
||||
alt="Sebin showing you his rings"
|
||||
|
|
@ -593,27 +593,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://twitter.com/tehknuxlight">Knuxlight</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref7" polaroidBorder>
|
||||
<RefFigure id="sebin-muscle-ref7" cornerText>
|
||||
<!-- max 1240px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref7.tiff?w=415;995;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref7.tiff?w=415;995;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1240px, (min-width: 80em) 1190px, (min-width: 35em) 995px, 415px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref7.tiff?w=415;995;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref7.tiff?w=415;995;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1240px, (min-width: 80em) 1190px, (min-width: 35em) 992px, 415px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref7.tiff?w=415;995;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref7.tiff?w=415;995;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1240px, (min-width: 80em) 1190px, (min-width: 35em) 992px, 415px"
|
||||
alt="Sebin ready to throw down"
|
||||
|
|
@ -626,27 +626,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://www.furaffinity.net/user/shonuff44">ShoNuff44</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref8" polaroidBorder>
|
||||
<RefFigure id="sebin-muscle-ref8" cornerText>
|
||||
<!-- max 1245px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref8.png?w=415;1000;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref8.png?w=415;1000;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 80em) 1200px, (min-width: 35em) 1000px, 415px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref8.png?w=415;1000;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref8.png?w=415;1000;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 80em) 1200px, (min-width: 35em) 1000px, 415px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref8.png?w=415;1000;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref8.png?w=415;1000;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 80em) 1200px, (min-width: 35em) 1000px, 415px"
|
||||
alt="Sebin looking aloof (but chill)"
|
||||
|
|
@ -659,27 +659,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://twitter.com/UsurpThem">Usurp</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref9" polaroidBorder>
|
||||
<RefFigure id="sebin-muscle-ref9" cornerText>
|
||||
<!-- max 2550px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref9.jpg?w=400;735;880;1120;800;1470;1760;2240;1200;2205;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref9.jpg?w=400;735;1470;1760;2240;1200;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1120px, (min-width: 80em) 880px, (min-width: 35em) 735px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref9.jpg?w=400;735;880;1120;800;1470;1760;2240;1200;2205;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref9.jpg?w=400;735;1470;1760;2240;1200;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1120px, (min-width: 80em) 880px, (min-width: 35em) 735px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref9.jpg?w=400;735;880;1120;800;1470;1760;2240;1200;2205;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref9.jpg?w=400;735;1470;1760;2240;1200;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1120px, (min-width: 80em) 880px, (min-width: 35em) 735px, 400px"
|
||||
alt="Sebin getting out of the pool"
|
||||
|
|
@ -692,27 +692,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://www.furaffinity.net/user/j-cock">j-cock</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref10" polaroidBorder nsfw>
|
||||
<RefFigure id="sebin-muscle-ref10" cornerText nsfw>
|
||||
<!-- max 2421px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref10.jpg?w=380;425;510;600;760;850;1020;1200;1140;1275;1530;1800&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref10.jpg?w=380;600;850;1275;1530;1800&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 600px, (min-width: 80em) 510px, (min-width: 35em) 425px, 380px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref10.jpg?w=380;425;510;600;760;850;1020;1200;1140;1275;1530;1800&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref10.jpg?w=380;600;850;1275;1530;1800&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 600px, (min-width: 80em) 510px, (min-width: 35em) 425px, 380px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref10.jpg?w=380;425;510;600;760;850;1020;1200;1140;1275;1530;1800&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref10.jpg?w=380;600;850;1275;1530;1800&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 600px, (min-width: 80em) 510px, (min-width: 35em) 425px, 380px"
|
||||
alt="Sebin getting frisky on the train"
|
||||
|
|
@ -725,27 +725,27 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<a href="https://twitter.com/Wintech3112">Winty</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
<RefFigure id="sebin-muscle-ref11" polaroidBorder>
|
||||
<RefFigure id="sebin-muscle-ref11" cornerText>
|
||||
<!-- max 3184px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref11.png?w=400;545;655;765;800;1090;1210;1530;1200;1635;1965;2295&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref11.png?w=400;765;1200;1635;1965;2295&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 765px, (min-width: 80em) 655px, (min-width: 35em) 545px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref11.png?w=400;545;655;765;800;1090;1210;1530;1200;1635;1965;2295&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref11.png?w=400;765;1200;1635;1965;2295&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 765px, (min-width: 80em) 655px, (min-width: 35em) 545px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/muscle/muscle-ref11.png?w=400;545;655;765;800;1090;1210;1530;1200;1635;1965;2295&png&withoutEnlargement&srcset
|
||||
@/assets/refs/muscle/muscle-ref11.png?w=400;765;1200;1635;1965;2295&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 765px, (min-width: 80em) 655px, (min-width: 35em) 545px, 400px"
|
||||
alt="Sebin getting ready to lift"
|
||||
|
|
@ -770,17 +770,17 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="@/assets/refs/sebin-ref-penis.png?w=480;720;0&avif&quality=75&srcset"
|
||||
srcset="@/assets/refs/sebin-ref-penis.png?w=480;720;0&format=avif&quality=75&as=srcset"
|
||||
sizes="(min-width: 45em) 1155px, (min-width: 30em) 720px, 480px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="@/assets/refs/sebin-ref-penis.png?w=480;720;0&webp&quality=100&srcset"
|
||||
srcset="@/assets/refs/sebin-ref-penis.png?w=480;720;0&format=webp&quality=100&as=srcset"
|
||||
sizes="(min-width: 45em) 1155px, (min-width: 30em) 720px, 480px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="@/assets/refs/sebin-ref-penis.png?w=480;720;0&png&srcset"
|
||||
srcset="@/assets/refs/sebin-ref-penis.png?w=480;720;0&format=png&as=srcset"
|
||||
sizes="(min-width: 45em) 1155px, (min-width: 30em) 720px, 480px"
|
||||
alt="Sebin's manly parts"
|
||||
loading="lazy"
|
||||
|
|
|
|||
|
|
@ -9,27 +9,27 @@ import RefGallery from '@/components/RefGallery.vue'
|
|||
</section>
|
||||
|
||||
<RefGallery>
|
||||
<RefFigure id="casual-outfit" polaroidBorder>
|
||||
<RefFigure id="casual-outfit" cornerText>
|
||||
<!-- max 1876px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/casual/fullbody.png?w=400;650;780;910;800;1300;1560;1820;1200;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/casual/fullbody.png?w=400;780;910;1300;1560;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 910px, (min-width: 80em) 780px, (min-width: 35em) 650px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/casual/fullbody.png?w=400;650;780;910;800;1300;1560;1820;1200;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/casual/fullbody.png?w=400;780;910;1300;1560;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 910px, (min-width: 80em) 780px, (min-width: 35em) 650px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/clothes/casual/fullbody.png?w=400;650;780;910;800;1300;1560;1820;1200;0&png&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/casual/fullbody.png?w=400;780;910;1300;1560;0&format=png&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 910px, (min-width: 80em) 780px, (min-width: 35em) 650px, 400px"
|
||||
alt="Sebin in his casual outfit"
|
||||
|
|
@ -38,35 +38,32 @@ import RefGallery from '@/components/RefGallery.vue'
|
|||
</picture>
|
||||
</template>
|
||||
|
||||
<template #caption>
|
||||
<p>Sebin in his casual outfit</p>
|
||||
<p>Black tank top, flannell shirt, shorts (w/ dangling bands), sneakers</p>
|
||||
</template>
|
||||
<template #caption>Sebin in his casual outfit</template>
|
||||
|
||||
<template #copyright>
|
||||
<a href="https://twitter.com/coffeerelated">coffeerelated</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
|
||||
<RefFigure id="sebin-winter-outfit" polaroidBorder>
|
||||
<RefFigure id="sebin-winter-outfit" cornerText>
|
||||
<!-- max 1470px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/cold/fullbody.png?w=400;655;785;915;800;1310;1200;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/cold/fullbody.png?w=400;785;915;1310;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 915px, (min-width: 80em) 785px, (min-width: 35em) 655px, 400px"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/cold/fullbody.png?w=400;655;785;915;800;1310;1200;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/cold/fullbody.png?w=400;785;915;1310;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 915px, (min-width: 80em) 785px, (min-width: 35em) 655px, 400px"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/clothes/cold/fullbody.png?w=400;655;785;915;800;1310;1200;0&jpg&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/cold/fullbody.png?w=400;785;915;1310;0&format=jpg&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 915px, (min-width: 80em) 785px, (min-width: 35em) 655px, 400px"
|
||||
alt="Sebin in his cold weather outfit"
|
||||
|
|
@ -75,35 +72,32 @@ import RefGallery from '@/components/RefGallery.vue'
|
|||
</picture>
|
||||
</template>
|
||||
|
||||
<template #caption>
|
||||
<p>Sebin in his cold weather outfit</p>
|
||||
<p>Winter coat, scarf, zip hoodie, jeans, winter boots</p>
|
||||
</template>
|
||||
<template #caption>Sebin in his cold weather outfit</template>
|
||||
|
||||
<template #copyright>
|
||||
<a href="https://twitter.com/lara_belem_">Lara Belém</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
|
||||
<RefFigure id="sebin-workout-outfit-fullbody" polaroidBorder>
|
||||
<RefFigure id="sebin-workout-outfit-fullbody" cornerText>
|
||||
<!-- max 1758px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/workout/fullbody.png?w=400;535;640;745;800;1070;1280;1490;1200;1605;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/workout/fullbody.png?w=400;640;800;1070;1280;1490;1605;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 745px, (min-width: 80em) 639px, (min-width: 35em) 532px, 400px"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/workout/fullbody.png?w=400;535;640;745;800;1070;1280;1490;1200;1605;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/workout/fullbody.png?w=400;640;800;1070;1280;1490;1605;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 745px, (min-width: 80em) 639px, (min-width: 35em) 532px, 400px"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/clothes/workout/fullbody.png?w=400;535;640;745;800;1070;1280;1490;1200;1605;0&jpg&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/workout/fullbody.png?w=400;640;800;1070;1280;1490;1605;0&format=jpg&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 745px, (min-width: 80em) 639px, (min-width: 35em) 532px, 400px"
|
||||
alt="Sebin in his workout outfit (fullbody)"
|
||||
|
|
@ -112,37 +106,32 @@ import RefGallery from '@/components/RefGallery.vue'
|
|||
</picture>
|
||||
</template>
|
||||
|
||||
<template #caption>
|
||||
<p>Sebin in his workout outfit</p>
|
||||
<p>
|
||||
<strong>Full body:</strong> Snapback hat, tank top, fingerless gloves, shorts, sneakers
|
||||
</p>
|
||||
</template>
|
||||
<template #caption>Sebin in his workout outfit (full body)</template>
|
||||
|
||||
<template #copyright>
|
||||
<a href="https://twitter.com/turquoize_art">Atlas</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
|
||||
<RefFigure id="sebin-workout-outfit-close" polaroidBorder>
|
||||
<RefFigure id="sebin-workout-outfit-close" cornerText>
|
||||
<!-- max 2480px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/workout/closeup.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/workout/closeup.png?w=400;600;800;1000;1200;1400;1800;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500x, 400px"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/workout/closeup.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/workout/closeup.png?w=400;600;800;1000;1200;1400;1800;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/clothes/workout/closeup.png?w=400;500;600;700;800;1000;1200;1400;1500;1800;2100&jpg&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/workout/closeup.png?w=400;600;800;1000;1200;1400;1800;0&format=jpg&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
alt="Sebin in his workout outfit (close-up)"
|
||||
|
|
@ -151,91 +140,83 @@ import RefGallery from '@/components/RefGallery.vue'
|
|||
</picture>
|
||||
</template>
|
||||
|
||||
<template #caption>
|
||||
<p>Sebin in his workout outfit</p>
|
||||
<p>
|
||||
<strong>Close-up:</strong> Snapback hat, headphones, tank top, fingerless gloves, shorts,
|
||||
smartwatch
|
||||
</p>
|
||||
</template>
|
||||
<template #caption>Sebin in his workout outfit (close-up)</template>
|
||||
|
||||
<template #copyright>
|
||||
<a href="https://twitter.com/purpledragonrei">Rei</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
|
||||
<RefFigure id="sebin-tracksuit-pants" polaroidBorder>
|
||||
<!-- max 961px -->
|
||||
<RefFigure id="sebin-tracksuit-pants" nsfw cornerText>
|
||||
<!-- max 1656px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/lazy/pants.jpg?w=400;500;600;700;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/lazy/fullbody.png?w=400;850;1210;1460;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
sizes="(min-width: 120em) 850px, (min-width: 80em) 730px, (min-width: 35em) 605px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/clothes/lazy/pants.jpg?w=400;500;600;700;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/lazy/fullbody.png?w=400;850;1210;1460;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
sizes="(min-width: 120em) 850px, (min-width: 80em) 730px, (min-width: 35em) 605px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/clothes/lazy/pants.jpg?w=400;500;600;700;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/clothes/lazy/fullbody.png?w=400;850;1210;1460;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 400px"
|
||||
sizes="(min-width: 120em) 850px, (min-width: 80em) 730px, (min-width: 35em) 605px, 400px"
|
||||
alt="Tracksuit pants"
|
||||
loading="lazy"
|
||||
/>
|
||||
</picture>
|
||||
</template>
|
||||
|
||||
<template #caption>
|
||||
<p>Tracksuit pants</p>
|
||||
<p>
|
||||
Sebin likes to wear comfortable clothes at home when he doesn't need to leave the house or
|
||||
is enjoying some leisure time after work or on weekends.
|
||||
</p>
|
||||
</template>
|
||||
<template #caption>Sebin in leisure tracksuit pants</template>
|
||||
|
||||
<!-- <template #copyright></template> -->
|
||||
<template #copyright>
|
||||
<a href="https://twitter.com/leolynx86">Leolynx</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
|
||||
<RefFigure id="sebin-topless" polaroidBorder>
|
||||
<!-- max 333px -->
|
||||
<RefFigure id="sebin-topless" cornerText>
|
||||
<!-- max 2119px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="@/assets/refs/clothes/lazy/undies.jpg?w=0&avif&withoutEnlargement&srcset"
|
||||
sizes="333px"
|
||||
srcset="
|
||||
@/assets/refs/clothes/lazy/undies.png?w=400;880;1028;1470;1760;0&format=avif&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1028px, (min-width: 80em) 880px, (min-width: 35em) 735px, 400px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="@/assets/refs/clothes/lazy/undies.jpg?w=0&webp&withoutEnlargement&srcset"
|
||||
sizes="333px"
|
||||
srcset="
|
||||
@/assets/refs/clothes/lazy/undies.png?w=400;880;1028;1470;1760;0&format=webp&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1028px, (min-width: 80em) 880px, (min-width: 35em) 735px, 400px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="@/assets/refs/clothes/lazy/undies.jpg?w=0&withoutEnlargement&srcset"
|
||||
sizes="333px"
|
||||
srcset="
|
||||
@/assets/refs/clothes/lazy/undies.png?w=400;880;1028;1470;1760;0&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 1028px, (min-width: 80em) 880px, (min-width: 35em) 735px, 400px"
|
||||
alt="Shorts"
|
||||
loading="lazy"
|
||||
/>
|
||||
</picture>
|
||||
</template>
|
||||
|
||||
<template #caption>
|
||||
<p>Topless w/ jockstrap/boxer briefs</p>
|
||||
<p>
|
||||
For even more comfort, Sebin tends to forgoe pants completely and save on laundry by only
|
||||
wearing the absolute necessary.
|
||||
</p>
|
||||
</template>
|
||||
<template #caption>Sebin in his favorite boxers</template>
|
||||
|
||||
<!-- <template #copyright></template> -->
|
||||
<template #copyright>
|
||||
<a href="https://twitter.com/Retroslime69">Retroslime69</a>
|
||||
</template>
|
||||
</RefFigure>
|
||||
</RefGallery>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -17,10 +17,10 @@ import {
|
|||
} from '@/sebin'
|
||||
import { dateFormat, getAge, toImperial, toLbs } from '@/helpers'
|
||||
import { nsfwKey, showModalKey } from '@/keys'
|
||||
import type { Kink } from '@/interfaces'
|
||||
import DataTable from '@/components/DataTable.vue'
|
||||
import QuickFacts from '@/components/QuickFacts.vue'
|
||||
import RefToggle from '@/components/RefToggle.vue'
|
||||
import FilteredList from '@/components/FilteredList.vue'
|
||||
|
||||
const generalHeadings = ['Key', 'Value']
|
||||
const generalData = [
|
||||
|
|
@ -39,14 +39,6 @@ const nsfwData = [
|
|||
['Position', position]
|
||||
]
|
||||
|
||||
const kinksHeadings = ['Kink', 'Receive', 'Give']
|
||||
const kinksData = kinks.map((kink: Kink): string[] => {
|
||||
const receive = kink.receive ? '✅' : '🚫'
|
||||
const give = kink.give ? '✅' : '🚫'
|
||||
|
||||
return [kink.name, receive, give]
|
||||
})
|
||||
|
||||
const isNsfw = inject<boolean>(nsfwKey, false)
|
||||
const showModal = inject<Function>(showModalKey, Function)
|
||||
</script>
|
||||
|
|
@ -197,7 +189,9 @@ const showModal = inject<Function>(showModalKey, Function)
|
|||
wants it. After all he is well endowed enough to peddle it around.
|
||||
</p>
|
||||
|
||||
<DataTable class="kinks" :headings="kinksHeadings" :data="kinksData" />
|
||||
<h3>Kinks</h3>
|
||||
|
||||
<FilteredList :data="kinks" />
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
|
|
|
|||
|
|
@ -9,27 +9,27 @@ import RefFigure from '@/components/RefFigure.vue'
|
|||
<h1>Overdrive Form</h1>
|
||||
</section>
|
||||
|
||||
<RefFigure id="overdrive-ref" polaroidBorder>
|
||||
<RefFigure id="overdrive-ref" cornerText>
|
||||
<!-- max 1080px -->
|
||||
<template #img>
|
||||
<picture>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-overdrive_ref-hires.jpg?w=450;500;600;900;0&avif&quality=75&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-overdrive_ref-hires.jpg?w=450;500;600;900;0&format=avif&quality=75&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 450px"
|
||||
type="image/avif"
|
||||
/>
|
||||
<source
|
||||
srcset="
|
||||
@/assets/refs/sebin-overdrive_ref-hires.jpg?w=450;500;600;900;0&webp&quality=100&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-overdrive_ref-hires.jpg?w=450;500;600;900;0&format=webp&quality=100&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 450px"
|
||||
type="image/webp"
|
||||
/>
|
||||
<img
|
||||
srcset="
|
||||
@/assets/refs/sebin-overdrive_ref-hires.jpg?w=450;500;600;900;0&jpg&quality=95&withoutEnlargement&srcset
|
||||
@/assets/refs/sebin-overdrive_ref-hires.jpg?w=450;500;600;900;0&format=jpg&quality=95&withoutEnlargement&as=srcset
|
||||
"
|
||||
sizes="(min-width: 120em) 700px, (min-width: 80em) 600px, (min-width: 35em) 500px, 450px"
|
||||
alt="Sebin in Overdrive"
|
||||
|
|
|
|||
14
tsconfig.app.json
Normal file
14
tsconfig.app.json
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.dom.json",
|
||||
"include": ["globals.d.ts", "env.d.ts", "src/**/*", "src/**/*.vue", "package.json"],
|
||||
"exclude": ["src/**/__tests__/*"],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
|
||||
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,16 +1,11 @@
|
|||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.web.json",
|
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
|
||||
"files": [],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.node.json"
|
||||
},
|
||||
{
|
||||
"path": "./tsconfig.app.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,20 @@
|
|||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.node.json",
|
||||
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*", "playwright.config.*"],
|
||||
"extends": "@tsconfig/node20/tsconfig.json",
|
||||
"include": [
|
||||
"globals.d.ts",
|
||||
"vite.config.*",
|
||||
"vitest.config.*",
|
||||
"cypress.config.*",
|
||||
"nightwatch.conf.*",
|
||||
"playwright.config.*"
|
||||
],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"noEmit": true,
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
||||
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Bundler",
|
||||
"types": ["node"]
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ import { fileURLToPath, URL } from 'node:url'
|
|||
|
||||
import { defineConfig } from 'vite'
|
||||
import { imagetools } from 'vite-imagetools'
|
||||
import autoprefixer from 'autoprefixer'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
|
|
@ -16,7 +17,7 @@ export default defineConfig({
|
|||
css: {
|
||||
devSourcemap: true,
|
||||
postcss: {
|
||||
plugins: [require('autoprefixer')]
|
||||
plugins: [autoprefixer({})]
|
||||
}
|
||||
}
|
||||
})
|
||||
Loading…
Add table
Add a link
Reference in a new issue