sebin-reference/src/views/Home.vue
2022-11-07 21:53:52 +01:00

109 lines
2.8 KiB
Vue
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<nsfw-warning v-show="$root.isWarn">
<template #heading>
<br />
Whoa, Nelly!
</template>
<template #message>
By enabling NSFW mode you confirm that you are of legal age to view adult
content.
</template>
<template #yes>Yes, show me the goods 👀</template>
<template #no>NO, STAHP 😱</template>
</nsfw-warning>
<prose>
<welcome>
<template #main>Sebin Nyshkim</template>
<template #sub>Character Reference Page</template>
</welcome>
<h3>Welcome to Sebin's Ref Page</h3>
<p>
On this page your can learn all about Sebin, your friendly neighborhood
dragon!
</p>
<p>
I started this page to have a single point of truth with all the info
artists I commission can possibly need. If you're missing some crucial
info, or you would like to give me some general feedback about this page,
feel free to reach out!
</p>
<ul>
<li>
<a href="https://twitter.com/SebinNyshkim">Twitter</a>
</li>
<li>
<a href="https://meow.social/@SebinNyshkim" rel="me">Mastodon</a>
</li>
<li>
<a href="https://t.me/SebinNyshkim">Telegram</a>
</li>
<li>
<a href="https://www.furaffinity.net/user/sonofdragons">
Fur Affinity
</a>
</li>
</ul>
<blockquote>
<strong>Note:</strong> This page is still under heavy construction, as
indicated by the 0.x.x version number in the footer. I'm continously
updating the site and adding details and information to it. In case you
run into something weird, definitely let me know!
</blockquote>
<h3>Complete Ref Sheet</h3>
<p>Just here to fetch the ref sheet?</p>
<div class="btn-group flex flex--row flex--wrap">
<btn href="/sebin-ref-full-SFW-hires.jpg">
Download <span v-if="$root.nsfw">SFW</span> Refsheet (10 MB)
</btn>
<btn v-if="$root.nsfw" href="/sebin-ref-full-NSFW-hires.jpg">
Download NSFW Refsheet (10,2 MB)
</btn>
</div>
<nsfw-switch
id="nsfw-switch"
v-model="$root.nsfw"
@change="$root.showWarning()"
/>
</prose>
</template>
<script>
import Prose from "@/components/Prose.vue";
import Welcome from "@/components/Welcome.vue";
import btn from "@/components/Button.vue";
import NsfwSwitch from "@/components/NsfwSwitch.vue";
import NsfwWarning from "@/components/NsfwWarning.vue";
export default {
name: "Home",
components: { Prose, Welcome, btn, NsfwSwitch, NsfwWarning },
};
</script>
<style lang="scss">
@import "@/scss/_mixins.scss";
.btn-group {
justify-content: space-evenly;
.btn {
flex: 1 0 100%;
margin: 1em 0;
@include mq-desktop {
flex: 0 0 auto;
}
}
}
</style>